feat: 解决冲突

pull/218/head
刘释隆 2 years ago
parent e0a4bc292a
commit b43e9beb2e

@ -1,48 +1,48 @@
<script lang="ts" setup> <script lang="ts" setup>
import { defineEmits, reactive, ref } from "vue"; import { defineEmits, reactive, ref } from 'vue'
import { QuillEditor } from "@vueup/vue-quill"; import { QuillEditor } from '@vueup/vue-quill'
import "@vueup/vue-quill/dist/vue-quill.snow.css"; import '@vueup/vue-quill/dist/vue-quill.snow.css'
import { debounce } from "lodash-es"; import { debounce } from 'lodash-es'
import { queryNote, saveNote } from "@/api/home/main"; import { queryNote, saveNote } from '@/api/home/main'
const emit = defineEmits(["close"]); const emit = defineEmits(['close'])
const quillEditor = ref(); const quillEditor = ref()
const cardStyle = { const cardStyle = {
"width": "500px", 'width': '500px',
"--n-padding-bottom": "17px", '--n-padding-bottom': '17px',
"--n-padding-left": "24px", '--n-padding-left': '24px',
}; }
const note = ref("<p>sss</p>"); const note = ref('<p>sss</p>')
const options = reactive({ const options = reactive({
modules: { modules: {
toolbar: [ toolbar: [
["bold", "italic", "underline", "strike"], // toggled buttons ['bold', 'italic', 'underline', 'strike'], // toggled buttons
[{ align: "" }, { align: "center" }, { align: "right" }, { align: "justify" }], [{ align: '' }, { align: 'center' }, { align: 'right' }, { align: 'justify' }],
], ],
}, },
theme: "snow", theme: 'snow',
placeholder: "", placeholder: '',
}); })
function initHandler() { function initHandler() {
queryNote() queryNote()
.then((res) => { .then((res) => {
if (res.data) if (res.data)
note.value = res.data.notecontent; note.value = res.data.notecontent
console.log("note:", note.value); console.log('note:', note.value)
}) })
.catch(e => console.log(e)); .catch(e => console.log(e))
} }
const saveHandler = debounce(() => { const saveHandler = debounce(() => {
const content = quillEditor.value.getHTML(); const content = quillEditor.value.getHTML()
saveNote(content); saveNote(content)
}, 800); }, 800)
</script> </script>
<template> <template>

@ -1,99 +1,99 @@
<script setup lang="ts"> <script setup lang="ts">
import { nextTick, onMounted, onUnmounted, reactive, ref, toRefs } from "vue"; import { nextTick, onMounted, onUnmounted, reactive, ref, toRefs } from 'vue'
import { debounce } from "lodash-es"; import { debounce } from 'lodash-es'
import { useRoute, useRouter } from "vue-router"; import { useRoute, useRouter } from 'vue-router'
import { deleteSearch, getSearchList, historySearch } from "@/api/search/search"; import { deleteSearch, getSearchList, historySearch } from '@/api/search/search'
import { storage } from "@/utils/Storage"; import { storage } from '@/utils/Storage'
const emit = defineEmits(["close"]); const emit = defineEmits(['close'])
const value = ref(""); const value = ref('')
const showList = ref(false); const showList = ref(false)
const historyList: any = ref([]); const historyList: any = ref([])
const handlerShowList = () => (showList.value = true); const handlerShowList = () => (showList.value = true)
const router = useRouter(); const router = useRouter()
const route = useRoute(); const route = useRoute()
const state = reactive({ const state = reactive({
resultList: [], resultList: [],
}) as any; }) as any
const { resultList } = toRefs(state); const { resultList } = toRefs(state)
const inputHandler = debounce((keyword) => { const inputHandler = debounce((keyword) => {
if (keyword) if (keyword)
handlerSearch(keyword); handlerSearch(keyword)
}, 500); }, 500)
// //
async function handlerSearch(value) { async function handlerSearch(value) {
const res = await getSearchList({ const res = await getSearchList({
search: value, search: value,
}); })
if (res.code === "OK") { if (res.code === 'OK') {
state.resultList = [ state.resultList = [
{ {
title: "图检审批", title: '图检审批',
path: "worksheet", path: 'worksheet',
data: res.data.ai, data: res.data.ai,
}, },
{ {
title: "任务审批管理", title: '任务审批管理',
path: "task", path: 'task',
data: res.data.preliminary, data: res.data.preliminary,
}, },
{ {
title: "任务终审管理", title: '任务终审管理',
path: "final", path: 'final',
data: res.data.final, data: res.data.final,
}, },
]; ]
} }
} }
function handlerHistory(name) { function handlerHistory(name) {
value.value = name; value.value = name
handlerSearch(name); handlerSearch(name)
} }
// //
async function deleteHistory() { async function deleteHistory() {
const res = await deleteSearch({}); const res = await deleteSearch({})
if (res.code === "OK") if (res.code === 'OK')
historyList.value = []; historyList.value = []
} }
// //
async function getHistory() { async function getHistory() {
const res = await historySearch({}); const res = await historySearch({})
if (res.code === "OK") if (res.code === 'OK')
historyList.value = res.data; historyList.value = res.data
} }
getHistory(); getHistory()
function goPath(item, id) { function goPath(item, id) {
const desiredObject = item.data.find((item) => { const desiredObject = item.data.find((item) => {
return item.id === id; return item.id === id
}); })
storage.set("isSearch", true); storage.set('isSearch', true)
router.push({ name: item.path, query: { id, searchContent: desiredObject.name } }); router.push({ name: item.path, query: { id, searchContent: desiredObject.name } })
emit("close"); emit('close')
} }
function highlightText(text, query) { function highlightText(text, query) {
if (!query) if (!query)
return text; return text
const regex = new RegExp(query, "gi"); const regex = new RegExp(query, 'gi')
const highlightedText = text.replace(regex, (match) => { const highlightedText = text.replace(regex, (match) => {
return `<span style="color:#507AFD" class="highlight">${match}</span>`; return `<span style="color:#507AFD" class="highlight">${match}</span>`
}); })
return highlightedText; return highlightedText
} }
onMounted(() => { onMounted(() => {
setTimeout(() => (value.value = "")); setTimeout(() => (value.value = ''))
handlerShowList(); handlerShowList()
handlerSearch(""); handlerSearch('')
}); })
</script> </script>
<template> <template>

@ -199,7 +199,7 @@ function editSelection(id = '') {
} }
function deleteSelection(id = '') { function deleteSelection(id = '') {
if (selectionIds.value.length === 0) { if (id) {
deleteCondition({ ids: id }).then(() => { deleteCondition({ ids: id }).then(() => {
query(pagination.page, pagination.pageSize) query(pagination.page, pagination.pageSize)
}) })

@ -1,14 +1,14 @@
<script lang="ts" setup> <script lang="ts" setup>
import { useInfiniteScroll } from "@vueuse/core"; import { useInfiniteScroll } from '@vueuse/core'
import { debounce } from "lodash-es"; import { debounce } from 'lodash-es'
import { onMounted, reactive, ref, watch } from "vue"; import { onMounted, reactive, ref, watch } from 'vue'
import type { FilterSearchParam } from "/#/api"; import type { FilterSearchParam } from '/#/api'
import type { Filter, FilterEntity } from "/#/home"; import type { Filter, FilterEntity } from '/#/home'
import { VueDraggable } from "vue-draggable-plus"; import { VueDraggable } from 'vue-draggable-plus'
import { asideMap } from "@/config/aside"; import { asideMap } from '@/config/aside'
import { favorite, getConditionList, sort, unfavorite } from "@/api/home/filter"; import { favorite, getConditionList, sort, unfavorite } from '@/api/home/filter'
defineOptions({ name: "AdvanceFilter" }); defineOptions({ name: 'AdvanceFilter' })
const props = defineProps({ const props = defineProps({
type: { type: {
@ -16,42 +16,42 @@ const props = defineProps({
default: 0, default: 0,
required: true, required: true,
}, },
}); })
const emit = defineEmits<{ const emit = defineEmits<{
(e: "show-filter"): void (e: 'show-filter'): void
(e: "show-custom"): void (e: 'show-custom'): void
(e: "update:search"): void (e: 'update:search'): void
(e: "select", id: string) (e: 'select', id: string)
}>(); }>()
const ruleForm = reactive({ const ruleForm = reactive({
keyword: "", keyword: '',
}); })
const ruleformRef = ref(); const ruleformRef = ref()
const data = ref<FilterEntity[]>([]); const data = ref<FilterEntity[]>([])
const unData = ref<FilterEntity[]>([]); const unData = ref<FilterEntity[]>([])
const loading = ref(false); const loading = ref(false)
const canloadMore = true; const canloadMore = true
const el = ref<HTMLDivElement | null>(null); const el = ref<HTMLDivElement | null>(null)
const popover = ref<ComponentRef | null>(null); const popover = ref<ComponentRef | null>(null)
const pagination = reactive({ const pagination = reactive({
pageNo: 1, pageNo: 1,
pageSize: 300, pageSize: 300,
}); })
const keyword = ref(""); const keyword = ref('')
const currentlySelectedAdvanced = ref("高级筛选"); const currentlySelectedAdvanced = ref('高级筛选')
onMounted(() => { onMounted(() => {
// data.value = generateDefaultConfig() // data.value = generateDefaultConfig()
}); })
// //
function generateDefaultConfig(): FilterEntity[] { function generateDefaultConfig(): FilterEntity[] {
return Object.keys(asideMap).reduce((acc, key) => { return Object.keys(asideMap).reduce((acc, key) => {
const { label, defaultValue, isDefaultFilter } = asideMap[key]; const { label, defaultValue, isDefaultFilter } = asideMap[key]
if (isDefaultFilter === true) { if (isDefaultFilter === true) {
const config = { const config = {
id: "", id: '',
name: label, name: label,
favorite: false, favorite: false,
isDefaultFilter, isDefaultFilter,
@ -61,73 +61,73 @@ function generateDefaultConfig(): FilterEntity[] {
value: defaultValue, value: defaultValue,
}, },
], ],
}; }
return [...acc, config]; return [...acc, config]
} }
else { else {
return acc; return acc
} }
}, []); }, [])
} }
useInfiniteScroll( useInfiniteScroll(
el as any, el as any,
() => { () => {
loadMore(); loadMore()
}, },
{ distance: 10, interval: 300, canLoadMore: () => false }, { distance: 10, interval: 300, canLoadMore: () => false },
); )
async function showClick() { async function showClick() {
getSearchedList(""); getSearchedList('')
} }
async function loadMore() { async function loadMore() {
if (loading.value || el.value == null) if (loading.value || el.value == null)
return; return
const more = await featchList(); const more = await featchList()
if (more.length === 0) if (more.length === 0)
return; return
data.value.push(...more); data.value.push(...more)
} }
async function featchList() { async function featchList() {
loading.value = true; loading.value = true
try { try {
const searchParam: FilterSearchParam = { const searchParam: FilterSearchParam = {
search_searchname: { value: ruleForm.keyword, op: "like", type: "string" }, search_searchname: { value: ruleForm.keyword, op: 'like', type: 'string' },
}; }
const result = await getConditionList(pagination, searchParam, props.type); const result = await getConditionList(pagination, searchParam, props.type)
const { data } = result; const { data } = result
// pagination.pageNo += 1 // pagination.pageNo += 1
// canloadMore = pageCount >= pagination.pageNo // canloadMore = pageCount >= pagination.pageNo
const entityList = generateFilterEntityList(data); const entityList = generateFilterEntityList(data)
return entityList; return entityList
} }
catch (error) { catch (error) {
return []; return []
} }
finally { finally {
loading.value = false; loading.value = false
} }
} }
// //
function generateFilterEntityList(data) { function generateFilterEntityList(data) {
const filterEntityList = data.map((item) => { const filterEntityList = data.map((item) => {
const { searchname, iztop, ocrUsersearchchildList, id, reorder } = item; const { searchname, iztop, ocrUsersearchchildList, id, reorder } = item
const list = ocrUsersearchchildList.map((item) => { const list = ocrUsersearchchildList.map((item) => {
const { searchfield, searchvalue } = item; const { searchfield, searchvalue } = item
return { return {
key: searchfield, key: searchfield,
value: searchvalue, value: searchvalue,
}; }
}); })
const reg = new RegExp(ruleForm.keyword, "gi"); const reg = new RegExp(ruleForm.keyword, 'gi')
const hilightText = searchname.replace(reg, `<span>${ruleForm.keyword}</span>`); const hilightText = searchname.replace(reg, `<span>${ruleForm.keyword}</span>`)
return { return {
id, id,
@ -137,128 +137,128 @@ function generateFilterEntityList(data) {
filterList: list, filterList: list,
reorder, reorder,
searchname, searchname,
}; }
}); })
return filterEntityList; return filterEntityList
} }
function selectHandler(item: FilterEntity) { function selectHandler(item: FilterEntity) {
(popover.value as any).setShow(false); (popover.value as any).setShow(false)
currentlySelectedAdvanced.value = item.searchname; currentlySelectedAdvanced.value = item.searchname
emit("select", item.id); emit('select', item.id)
} }
const inputHandler = debounce((word) => { const inputHandler = debounce((word) => {
ruleForm.keyword = word; ruleForm.keyword = word
ruleformRef.value.validate(); ruleformRef.value.validate()
if (word.length < 2 && word) if (word.length < 2 && word)
return; return
getSearchedList(word); getSearchedList(word)
}, 300); }, 300)
function getSearchedList(word, isScroll = false) { function getSearchedList(word, isScroll = false) {
if (word) if (word)
pagination.pageSize = 300; pagination.pageSize = 300
if (!word) if (!word)
pagination.pageSize = 10; pagination.pageSize = 10
if (isScroll) if (isScroll)
pagination.pageSize = 300; pagination.pageSize = 300
ruleForm.keyword = word; ruleForm.keyword = word
featchList().then((list) => { featchList().then((list) => {
const dataArr: FilterEntity[] = []; const dataArr: FilterEntity[] = []
const unDataArr: FilterEntity[] = []; const unDataArr: FilterEntity[] = []
list.forEach((item) => { list.forEach((item) => {
if (item.favorite && !item.isDefaultFilter) if (item.favorite && !item.isDefaultFilter)
dataArr.push(item); dataArr.push(item)
if (!item.favorite && !item.isDefaultFilter) if (!item.favorite && !item.isDefaultFilter)
unDataArr.push(item); unDataArr.push(item)
}); })
data.value = dataArr.sort( data.value = dataArr.sort(
(a, b) => Number(new Date(a.createtime)) - Number(new Date(b.createtime)), (a, b) => Number(new Date(a.createtime)) - Number(new Date(b.createtime)),
); )
unData.value = unDataArr.sort( unData.value = unDataArr.sort(
(a, b) => Number((a as any).reorder) - Number((b as any).reorder), (a, b) => Number((a as any).reorder) - Number((b as any).reorder),
); )
}); })
} }
function favoriteHandler(event: MouseEvent, item: any) { function favoriteHandler(event: MouseEvent, item: any) {
event.stopImmediatePropagation(); event.stopImmediatePropagation()
event.stopPropagation(); event.stopPropagation()
const { isDefaultFilter, id } = item; const { isDefaultFilter, id } = item
if (!isDefaultFilter) { if (!isDefaultFilter) {
item.favorite = true; item.favorite = true
favorite(id); favorite(id)
data.value.forEach((v, index) => { data.value.forEach((v, index) => {
if (v.id == id) if (v.id == id)
sort(v.id, 0); sort(v.id, 0)
else sort(v.id, index + 1); else sort(v.id, index + 1)
}); })
inputHandler(ruleForm.keyword); inputHandler(ruleForm.keyword)
} }
} }
const rules = { const rules = {
keyword: [ keyword: [
{ {
trigger: ["blur", "input", "change"], trigger: ['blur', 'input', 'change'],
level: "error", level: 'error',
validator(_rule, value) { validator(_rule, value) {
if (value.length >= 2) if (value.length >= 2)
return true; return true
else return new Error("搜索关键字最少为两个"); else return new Error('搜索关键字最少为两个')
}, },
}, },
], ],
}; }
function unFavoriteHandler(event: MouseEvent, item) { function unFavoriteHandler(event: MouseEvent, item) {
event.stopImmediatePropagation(); event.stopImmediatePropagation()
event.stopPropagation(); event.stopPropagation()
const { isDefaultFilter, id } = item; const { isDefaultFilter, id } = item
if (!isDefaultFilter) { if (!isDefaultFilter) {
item.favorite = false; item.favorite = false
unfavorite(id); unfavorite(id)
inputHandler(ruleForm.keyword); inputHandler(ruleForm.keyword)
} }
} }
function handleScroll(event) { function handleScroll(event) {
let timer; let timer
if (timer) { if (timer) {
clearTimeout(timer); clearTimeout(timer)
} }
else { else {
timer = setTimeout(() => { timer = setTimeout(() => {
getSearchedList("", true); getSearchedList('', true)
}, 2000); }, 2000)
} }
} }
function moveEnd() { function moveEnd() {
unData.value.forEach((v, index) => { unData.value.forEach((v, index) => {
sort(v.id, index); sort(v.id, index)
}); })
} }
function setCurrentlySelectedAdvanced(value: string) { function setCurrentlySelectedAdvanced(value: string) {
currentlySelectedAdvanced.value = value; currentlySelectedAdvanced.value = value
} }
defineExpose({ defineExpose({
setCurrentlySelectedAdvanced, setCurrentlySelectedAdvanced,
}); })
</script> </script>
<template> <template>

@ -40,8 +40,8 @@ const $message = window.$message
const show = ref(false) const show = ref(false)
const cardStyle = { const cardStyle = {
"width": '808px', 'width': '808px',
"height": '840px', 'height': '840px',
'--n-padding-bottom': '10px', '--n-padding-bottom': '10px',
'--n-padding-left': '10px', '--n-padding-left': '10px',
} }
@ -202,11 +202,10 @@ function handleCheck(rowKeys: DataTableRowKey[]) {
} }
function select(key: number, id: string) { function select(key: number, id: string) {
switch (key) { if (key == 1) {
case 1:
editSelection(id) editSelection(id)
break }
case 2: else {
const modalInst = modal.create({ const modalInst = modal.create({
title: '确认提示', title: '确认提示',
content: '确认删除该条过滤条件吗?', content: '确认删除该条过滤条件吗?',
@ -216,10 +215,24 @@ function select(key: number, id: string) {
onPositiveClick: () => deleteSelection(id), onPositiveClick: () => deleteSelection(id),
onNegativeClick: () => modalInst.destroy(), onNegativeClick: () => modalInst.destroy(),
}) })
break
default:
break
} }
// switch (key) {
// case 1:
// break;
// case 2:
// const modalInst = modal.create({
// title: "",
// content: "?",
// positiveText: "",
// negativeText: "",
// preset: "dialog",
// onPositiveClick: () => deleteSelection(id),
// onNegativeClick: () => modalInst.destroy(),
// });
// break;
// default:
// break;
// }
} }
function editSelection(id) { function editSelection(id) {
@ -238,7 +251,7 @@ function editSelection(id) {
} }
function deleteSelection(id = '') { function deleteSelection(id = '') {
if (selectionIds.value.length === 0) { if (id) {
deleteCondition({ ids: id }).then(() => { deleteCondition({ ids: id }).then(() => {
query(pagination.page, pagination.pageSize) query(pagination.page, pagination.pageSize)
}) })

@ -1,14 +1,15 @@
<script lang="ts" setup> <script lang="ts" setup>
import { EllipsisHorizontal, EyeOutline as EyeOutlineIcon } from "@vicons/ionicons5"; /** eslint-disable */
import { Download as DownloadIcon, Upload as UploadIcon } from "@vicons/tabler"; import { EllipsisHorizontal, EyeOutline as EyeOutlineIcon } from '@vicons/ionicons5'
import { Icon } from "@vicons/utils"; import { Download as DownloadIcon, Upload as UploadIcon } from '@vicons/tabler'
import { useInfiniteScroll } from "@vueuse/core"; import { Icon } from '@vicons/utils'
import dayjs from "dayjs"; import { useInfiniteScroll } from '@vueuse/core'
import imagesloaded from "imagesloaded"; import dayjs from 'dayjs'
import { cloneDeep, debounce } from "lodash-es"; import imagesloaded from 'imagesloaded'
import Masonry from "masonry-layout"; import { cloneDeep, debounce } from 'lodash-es'
import { NIcon, useMessage } from "naive-ui"; import Masonry from 'masonry-layout'
import type { Component } from "vue"; import { NIcon, useMessage } from 'naive-ui'
import type { Component } from 'vue'
import { import {
computed, computed,
h, h,
@ -20,25 +21,25 @@ import {
ref, ref,
unref, unref,
watch, watch,
} from "vue"; } from 'vue'
import axios from "axios"; import axios from 'axios'
import CheckingTaskModal from "./modal/CheckingTaskModal.vue"; import CheckingTaskModal from './modal/CheckingTaskModal.vue'
import FinishPackageModal from "./modal/FinishPackageModal.vue"; import FinishPackageModal from './modal/FinishPackageModal.vue'
import GeneratePackageModal from "./modal/GeneratePackageModal.vue"; import GeneratePackageModal from './modal/GeneratePackageModal.vue'
import LoginSuccessModal from "./modal/LoginSuccessModal.vue"; import LoginSuccessModal from './modal/LoginSuccessModal.vue'
import PackageSettingsModal from "./modal/PackageSettingsModal.vue"; import PackageSettingsModal from './modal/PackageSettingsModal.vue'
import QueryRepeatedTasksModal from "./modal/QueryRepeatedTasksModal.vue"; import QueryRepeatedTasksModal from './modal/QueryRepeatedTasksModal.vue'
import type { PictureSortParam } from "/#/api"; import type { PictureSortParam } from '/#/api'
import defaultAvatar from "@/assets/icons/avatar.svg"; import defaultAvatar from '@/assets/icons/avatar.svg'
import baseImg from "@/assets/images/baseImg.png"; import baseImg from '@/assets/images/baseImg.png'
import { getImgUrl } from "@/utils/urlUtils"; import { getImgUrl } from '@/utils/urlUtils'
import emitter from "@/utils/mitt"; import emitter from '@/utils/mitt'
import { hideDownload } from "@/utils/image"; import { hideDownload } from '@/utils/image'
import { getViewportOffset } from "@/utils/domUtils"; import { getViewportOffset } from '@/utils/domUtils'
import { useConfig } from "@/store/modules/asideConfig"; import { useConfig } from '@/store/modules/asideConfig'
import { useWindowSizeFn } from "@/hooks/event/useWindowSizeFn"; import { useWindowSizeFn } from '@/hooks/event/useWindowSizeFn'
import { timeOptions, viewOptions } from "@/config/home"; import { timeOptions, viewOptions } from '@/config/home'
import avatar from "@/assets/images/avatar.jpg"; import avatar from '@/assets/images/avatar.jpg'
import { import {
createPackage, createPackage,
getCheckDuplicateStatus, getCheckDuplicateStatus,
@ -47,178 +48,178 @@ import {
oneClickCheckTaskPackage, oneClickCheckTaskPackage,
queryPageListByCheckNo, queryPageListByCheckNo,
removeCheckDuplicate, removeCheckDuplicate,
} from "@/api/home/main"; } from '@/api/home/main'
const listData = ref<any[]>([]); const listData = ref<any[]>([])
const timer = ref(); const timer = ref()
const showClose = ref(false); const showClose = ref(false)
const deviceHeight = ref(600); const deviceHeight = ref(600)
let _masonry: null | Masonry = null; let _masonry: null | Masonry = null
let _imagesload: any; let _imagesload: any
const masonryRef = ref<ComponentRef>(null); const masonryRef = ref<ComponentRef>(null)
const el = ref<HTMLDivElement | null>(null); const el = ref<HTMLDivElement | null>(null)
const viewMode = ref("masonry"); const viewMode = ref('masonry')
const pagination = reactive({ const pagination = reactive({
pageNo: 0, pageNo: 0,
pageSize: 30, pageSize: 30,
}); })
const configStore = useConfig(); const configStore = useConfig()
const packageModalRef = ref(null); const packageModalRef = ref(null)
const generateModalRef = ref(null); const generateModalRef = ref(null)
const queryRepeatedTasksModalRef = ref(null); const queryRepeatedTasksModalRef = ref(null)
const LoginSuccessModalRef = ref(null); const LoginSuccessModalRef = ref(null)
const checkingTaskModalRef = ref(null); const checkingTaskModalRef = ref(null)
const finishPackageModal = ref(null); const finishPackageModal = ref(null)
const loading = ref(false); const loading = ref(false)
const message = useMessage(); const message = useMessage()
const totalCount = ref(0); const totalCount = ref(0)
const sortBy: PictureSortParam = { const sortBy: PictureSortParam = {
orderbyname: "desc", orderbyname: 'desc',
orderbyvalue: "pictureResult", orderbyvalue: 'pictureResult',
}; }
const imageRef = ref<ComponentElRef | null>(); const imageRef = ref<ComponentElRef | null>()
const checkDuplicateNo = ref(""); const checkDuplicateNo = ref('')
const checkTaskStatus = ref(null); // 1. 2. 3. const checkTaskStatus = ref(null) // 1. 2. 3.
const isRefresh = ref(true); // const isRefresh = ref(true) //
let canloadMore = true; let canloadMore = true
let filterId = null; let filterId = null
async function computeListHeight() { async function computeListHeight() {
const headEl = document.querySelector(".wrapper-content")!; const headEl = document.querySelector('.wrapper-content')!
const { bottomIncludeBody } = getViewportOffset(headEl); const { bottomIncludeBody } = getViewportOffset(headEl)
const height = bottomIncludeBody; const height = bottomIncludeBody
deviceHeight.value = height - 40 - 16 - 24; deviceHeight.value = height - 40 - 16 - 24
} }
useWindowSizeFn(computeListHeight); useWindowSizeFn(computeListHeight)
const listStyle = computed(() => { const listStyle = computed(() => {
return { return {
height: `${deviceHeight.value}px`, height: `${deviceHeight.value}px`,
}; }
}); })
const layout = debounce(() => { const layout = debounce(() => {
if (masonryRef.value == null || el.value == null) if (masonryRef.value == null || el.value == null)
return; return
if (_masonry !== null) if (_masonry !== null)
(_masonry as any).addItems(); (_masonry as any).addItems()
_masonry = new Masonry(masonryRef.value as any, { _masonry = new Masonry(masonryRef.value as any, {
itemSelector: ".grid-item", itemSelector: '.grid-item',
gutter: 17, gutter: 17,
columnWidth: 182, columnWidth: 182,
percentPosition: true, percentPosition: true,
stagger: 10, stagger: 10,
}); })
_imagesload = imagesloaded(".grid-item"); _imagesload = imagesloaded('.grid-item')
_imagesload.on("done", (instance) => { _imagesload.on('done', (instance) => {
(_masonry as any).layout(); (_masonry as any).layout()
if (!el.value) if (!el.value)
return; return
loading.value = false; loading.value = false
}); })
_imagesload.on("fail", (instance) => { _imagesload.on('fail', (instance) => {
message.error("图片错误"); message.error('图片错误')
loading.value = false; loading.value = false
}); })
}, 300); }, 300)
useInfiniteScroll( useInfiniteScroll(
el as any, el as any,
() => { () => {
loadMore(); loadMore()
}, },
{ distance: 10, canLoadMore: () => canloadMore }, { distance: 10, canLoadMore: () => canloadMore },
); )
onUpdated(() => { onUpdated(() => {
layout(); layout()
}); })
const timeRange = ref(""); const timeRange = ref('')
const timeLabel = computed(() => { const timeLabel = computed(() => {
const item = timeOptions.find((option) => { const item = timeOptions.find((option) => {
return option.value === timeRange.value; return option.value === timeRange.value
}); })
return item?.label; return item?.label
}); })
const viewLabel = computed(() => { const viewLabel = computed(() => {
const item = viewOptions.find((option) => { const item = viewOptions.find((option) => {
return option.value === viewMode.value; return option.value === viewMode.value
}); })
return item?.label; return item?.label
}); })
const isAllowDownload = ref(true); const isAllowDownload = ref(true)
const calNum = ref(0); const calNum = ref(0)
const searchValue = ref(""); const searchValue = ref('')
const isInitSeaerch = ref(false); // const isInitSeaerch = ref(false) //
configStore.$subscribe(() => { configStore.$subscribe(() => {
console.log("subscribe", "configStore"); console.log('subscribe', 'configStore')
isAllowDownload.value = configStore.isAllowDownload; isAllowDownload.value = configStore.isAllowDownload
calNum.value = configStore.getTimeNum; calNum.value = configStore.getTimeNum
// console.log("calNum.value----------", calNum.value); // console.log("calNum.value----------", calNum.value);
searchValue.value = configStore.getSearchValue; searchValue.value = configStore.getSearchValue
console.log(configStore.getSearchValue, "getSearchValue"); console.log(configStore.getSearchValue, 'getSearchValue')
}); })
watch( watch(
() => searchValue.value, () => searchValue.value,
async (newVal, oldVal) => { async (newVal, oldVal) => {
if (newVal) { if (newVal) {
isInitSeaerch.value = true; isInitSeaerch.value = true
pagination.pageNo = 0; pagination.pageNo = 0
const more = await featchList(); const more = await featchList()
listData.value = more; listData.value = more
isInitSeaerch.value = false; isInitSeaerch.value = false
// configStore.setSearchValue(""); // configStore.setSearchValue("");
} }
else { else {
isInitSeaerch.value = true; isInitSeaerch.value = true
pagination.pageNo = 0; pagination.pageNo = 0
const more = await featchList(); const more = await featchList()
listData.value = more; listData.value = more
isInitSeaerch.value = false; isInitSeaerch.value = false
} }
}, },
); )
async function featchList(userSearchId?: string) { async function featchList(userSearchId?: string) {
loading.value = true; loading.value = true
try { try {
const contentParams = { const contentParams = {
search_month: timeRange.value, search_month: timeRange.value,
search_history: 0, search_history: 0,
userSearchId, userSearchId,
}; }
pagination.pageNo += 1; pagination.pageNo += 1
const searchValue = configStore.getSearchValue; // rao const searchValue = configStore.getSearchValue // rao
const asideParams = unref(configStore.getAsideValue); const asideParams = unref(configStore.getAsideValue)
const params = filterId ? { userSearchId: filterId } : cloneDeep(asideParams); const params = filterId ? { userSearchId: filterId } : cloneDeep(asideParams)
let result = { let result = {
pageCount: 0, pageCount: 0,
data: [], data: [],
total: 0, total: 0,
}; }
const sortObj: any = {}; // rao start const sortObj: any = {} // rao start
if (sortBy.orderbyvalue == "pictureResult") if (sortBy.orderbyvalue == 'pictureResult')
sortObj.ordertype = sortBy.orderbyname; sortObj.ordertype = sortBy.orderbyname
else if (sortBy.orderbyvalue == "fromuptime") else if (sortBy.orderbyvalue == 'fromuptime')
sortObj.orderByTime = sortBy.orderbyname; sortObj.orderByTime = sortBy.orderbyname
if (params.izsimilarity && typeof params.izsimilarity != "string") if (params.izsimilarity && typeof params.izsimilarity != 'string')
params.izsimilarity = params.izsimilarity.join("-"); params.izsimilarity = params.izsimilarity.join('-')
// rao end // rao end
@ -230,7 +231,7 @@ async function featchList(userSearchId?: string) {
...sortObj, ...sortObj,
checkDuplicateNo: checkDuplicateNo.value, checkDuplicateNo: checkDuplicateNo.value,
upUserName: searchValue, upUserName: searchValue,
}); })
} }
else { else {
result = await getPictureList({ result = await getPictureList({
@ -239,11 +240,11 @@ async function featchList(userSearchId?: string) {
...params, ...params,
...sortObj, ...sortObj,
upUserName: searchValue, upUserName: searchValue,
}); })
} }
const { data, pageCount, total } = result; const { data, pageCount, total } = result
totalCount.value = total; totalCount.value = total
canloadMore = pageCount >= pagination.pageNo && pageCount > 0; canloadMore = pageCount >= pagination.pageNo && pageCount > 0
const list = data.map((item) => { const list = data.map((item) => {
return { return {
@ -255,172 +256,168 @@ async function featchList(userSearchId?: string) {
similar: item.similarityscore || -1, similar: item.similarityscore || -1,
imgName: item.imgname, imgName: item.imgname,
loadOver: false, loadOver: false,
}; }
}); })
return list; return list
} }
catch (error) { catch (error) {
canloadMore = false; canloadMore = false
return []; return []
} }
} }
async function loadMore() { async function loadMore() {
if (loading.value || el.value == null) if (loading.value || el.value == null)
return; return
const more = await featchList(); const more = await featchList()
// if(isInitSeaerch.value) { // if(isInitSeaerch.value) {
// listData.value = []; // listData.value = [];
// isInitSeaerch.value = false; // isInitSeaerch.value = false;
// } // }
listData.value.push(...more); listData.value.push(...more)
} }
const gridHeight = computed(() => { const gridHeight = computed(() => {
let height = ""; let height = ''
if (viewMode.value === "masonry") if (viewMode.value === 'masonry')
height = ""; height = ''
else if (viewMode.value === "horizontalVersion") else if (viewMode.value === 'horizontalVersion')
height = "145px"; height = '145px'
else if (viewMode.value === "verticalVersion") else if (viewMode.value === 'verticalVersion')
height = "300px"; height = '300px'
else if (viewMode.value === "3:4") else if (viewMode.value === '3:4')
height = "240px"; height = '240px'
return height; return height
}); })
async function oneCheck() { async function oneCheck() {
const asideVal = cloneDeep(configStore.getAsideValue); const asideVal = cloneDeep(configStore.getAsideValue)
asideVal.upUserName = searchValue.value; asideVal.upUserName = searchValue.value
console.log("searchValue", asideVal, searchValue.value); console.log('searchValue', asideVal, searchValue.value)
if (asideVal.izyear && asideVal.izyear.length == 2) { if (asideVal.izyear && asideVal.izyear.length == 2) {
asideVal.izyear asideVal.izyear = `${dayjs(asideVal.izyear[0]).format('YYYY/MM/DD')}-${dayjs(
= `${dayjs(asideVal.izyear[0]).format("YYYY/MM/DD") asideVal.izyear[1],
}-${ ).format('YYYY/MM/DD')}`
dayjs(asideVal.izyear[1]).format("YYYY/MM/DD")}`;
} }
if (asideVal.izsimilarity && typeof asideVal.izsimilarity != "string") if (asideVal.izsimilarity && typeof asideVal.izsimilarity != 'string')
asideVal.izsimilarity = asideVal.izsimilarity.join("-"); asideVal.izsimilarity = asideVal.izsimilarity.join('-')
const tasksLoadingModal = queryRepeatedTasksModalRef.value as any; const tasksLoadingModal = queryRepeatedTasksModalRef.value as any
console.log("calNum.value111111111111111", calNum.value, checkTaskStatus.value); console.log('calNum.value111111111111111', calNum.value, checkTaskStatus.value)
if (calNum.value == 0 && isRefresh.value) { if (calNum.value == 0 && isRefresh.value) {
if (timer.value) if (timer.value)
clearInterval(timer.value); clearInterval(timer.value)
timer.value = setInterval(() => { timer.value = setInterval(() => {
console.log("calNum.value2222222222222", calNum.value, checkTaskStatus.value); console.log('calNum.value2222222222222', calNum.value, checkTaskStatus.value)
if (checkDuplicateNo.value) { if (checkDuplicateNo.value) {
getCheckDuplicateStatus(checkDuplicateNo.value).then((res) => { getCheckDuplicateStatus(checkDuplicateNo.value).then((res) => {
if (res.code === "OK") { if (res.code === 'OK') {
checkTaskStatus.value = res.data.status; checkTaskStatus.value = res.data.status
if (calNum.value < 90) if (calNum.value < 90)
calNum.value = calNum.value + 10; calNum.value = calNum.value + 10
configStore.setTimeNum(calNum.value); configStore.setTimeNum(calNum.value)
if (checkTaskStatus.value === 2 || checkTaskStatus.value === 3) { if (checkTaskStatus.value === 2 || checkTaskStatus.value === 3) {
if (checkTaskStatus.value === 2) if (checkTaskStatus.value === 2)
message.success("任务执行完毕,正在刷新数据..."); message.success('任务执行完毕,正在刷新数据...')
else else message.error('查询异常')
message.error("查询异常");
tasksLoadingModal.closeOnlyModal(); tasksLoadingModal.closeOnlyModal()
configStore.setTimeNum(100); configStore.setTimeNum(100)
if (timer.value) if (timer.value)
clearInterval(timer.value); clearInterval(timer.value)
setTimeout(() => { setTimeout(() => {
configStore.setTimeNum(0); configStore.setTimeNum(0)
}, 1000); }, 1000)
reset(); reset()
loadMore(); loadMore()
} }
} }
else { else {
if (timer.value) if (timer.value)
clearInterval(timer.value); clearInterval(timer.value)
} }
}); })
} }
}, 1000); }, 1000)
} }
// ,,.. // ,,..
if (checkDuplicateNo.value && checkTaskStatus.value && checkTaskStatus.value === 1) { if (checkDuplicateNo.value && checkTaskStatus.value && checkTaskStatus.value === 1) {
// rao // rao
tasksLoadingModal.showModal(); tasksLoadingModal.showModal()
return; return
} }
// //
oneClickCheckTaskPackage(asideVal).then((res) => { oneClickCheckTaskPackage(asideVal).then((res) => {
if (res.code === "OK") { if (res.code === 'OK') {
checkDuplicateNo.value = res.data.checkDuplicateNo; checkDuplicateNo.value = res.data.checkDuplicateNo
checkTaskStatus.value = res.data.status; checkTaskStatus.value = res.data.status
tasksLoadingModal.showModal(); // rao tasksLoadingModal.showModal() // rao
} }
else { else {
message.error(res.message || "查重失败"); message.error(res.message || '查重失败')
} }
}); })
} }
/** /**
* 显示添加任务包 * 显示添加任务包
*/ */
async function showAddPackage() { async function showAddPackage() {
const modal = packageModalRef.value as any; const modal = packageModalRef.value as any
modal.showModal(); modal.showModal()
} }
// , // ,
async function tasksLoadingCloseCallback() { async function tasksLoadingCloseCallback() {
const checkingTaskModal = checkingTaskModalRef.value as any; const checkingTaskModal = checkingTaskModalRef.value as any
checkingTaskModal.showModal(); checkingTaskModal.showModal()
if (isRefresh.value) if (isRefresh.value)
refresh(true); refresh(true)
} }
async function showLoginSuccessModal() { async function showLoginSuccessModal() {
const modal = LoginSuccessModalRef.value as any; const modal = LoginSuccessModalRef.value as any
modal.showModal(); modal.showModal()
} }
// id // id
const packageIdRef = ref(""); const packageIdRef = ref('')
async function commitHandler(settingParam) { async function commitHandler(settingParam) {
const params = { const params = {
name: settingParam.packagename, name: settingParam.packagename,
checkDuplicateNo: checkDuplicateNo.value, checkDuplicateNo: checkDuplicateNo.value,
}; }
const modal = generateModalRef.value as any; const modal = generateModalRef.value as any
const finishModal = finishPackageModal.value as any; const finishModal = finishPackageModal.value as any
modal.showModal(); modal.showModal()
createPackage(params).then((res) => { createPackage(params).then((res) => {
if (res.code === "OK") { if (res.code === 'OK') {
message.success(res.message); message.success(res.message)
packageIdRef.value = res.data.id; packageIdRef.value = res.data.id
modal.closeModal(); modal.closeModal()
finishModal.showModal(); finishModal.showModal()
// //
checkDuplicateNo.value = ""; checkDuplicateNo.value = ''
checkTaskStatus.value = null; checkTaskStatus.value = null
} }
}); })
const asideVal = configStore.getAsideValue; const asideVal = configStore.getAsideValue
const finalParam = { ...asideVal }; const finalParam = { ...asideVal }
finalParam.buessinessno = settingParam.packagename; finalParam.buessinessno = settingParam.packagename
finalParam.search_history = settingParam.comparehistory ? 1 : 0; finalParam.search_history = settingParam.comparehistory ? 1 : 0
} }
onMounted(() => { onMounted(() => {
emitter.on("filter", refreshHandler); emitter.on('filter', refreshHandler)
// emitter.on("filter", (searchId)=>{ // emitter.on("filter", (searchId)=>{
// console.log("emitter on filter" + searchId) // console.log("emitter on filter" + searchId)
// reset(); // reset();
@ -428,119 +425,118 @@ onMounted(() => {
// }); // });
// //
getLastCheckNo().then((res) => { getLastCheckNo().then((res) => {
if (res.code === "OK") if (res.code === 'OK')
checkDuplicateNo.value = res.data; checkDuplicateNo.value = res.data
})
});
nextTick(() => { nextTick(() => {
computeListHeight(); computeListHeight()
// //
// showLoginSuccessModal() // showLoginSuccessModal()
}); })
}); })
onUnmounted(() => { onUnmounted(() => {
emitter.off("filter", refreshHandler); emitter.off('filter', refreshHandler)
}); })
watch(timeRange, () => { watch(timeRange, () => {
refreshHandler(); refreshHandler()
}); })
watch( watch(
() => configStore.asideValue, () => configStore.asideValue,
(newVal, oldVal) => { (newVal, oldVal) => {
refreshHandler(); refreshHandler()
}, },
{ deep: true }, { deep: true },
); )
function reset() { function reset() {
pagination.pageNo = 0; pagination.pageNo = 0
pagination.pageSize = 30; pagination.pageSize = 30
listData.value.length = 0; listData.value.length = 0
loading.value = false; loading.value = false
canloadMore = true; canloadMore = true
filterId = null; filterId = null
layout(); layout()
} }
async function refreshHandler(filtersearchId?: any) { async function refreshHandler(filtersearchId?: any) {
reset(); reset()
if (filtersearchId) if (filtersearchId)
filterId = filtersearchId; filterId = filtersearchId
nextTick(() => { nextTick(() => {
setTimeout(() => { setTimeout(() => {
useInfiniteScroll( useInfiniteScroll(
el as any, el as any,
() => { () => {
loadMore(); loadMore()
}, },
{ distance: 10, canLoadMore: () => canloadMore }, { distance: 10, canLoadMore: () => canloadMore },
); )
}, 300); }, 300)
}); })
} }
function getAvatar(url: string): string { function getAvatar(url: string): string {
return url ? getImgUrl(url) : avatar; return url ? getImgUrl(url) : avatar
} }
function sortHandler(orderby: "pictureResult" | "fromuptime") { function sortHandler(orderby: 'pictureResult' | 'fromuptime') {
sortBy.orderbyvalue = orderby; sortBy.orderbyvalue = orderby
sortBy.orderbyname = sortBy.orderbyname === "asc" ? "desc" : "asc"; sortBy.orderbyname = sortBy.orderbyname === 'asc' ? 'desc' : 'asc'
refreshHandler(); refreshHandler()
} }
async function downloadImage(item) { async function downloadImage(item) {
if (!item.imgUrl) { if (!item.imgUrl) {
message.error("请输入有效的图片链接地址"); message.error('请输入有效的图片链接地址')
return; return
} }
try { try {
// 使 fetch GET // 使 fetch GET
const response = await fetch(item.imgUrl, { const response = await fetch(item.imgUrl, {
method: "GET", method: 'GET',
mode: "cors", // mode: 'cors', //
cache: "default", cache: 'default',
}); })
// //
if (!response.ok) if (!response.ok)
throw new Error(`HTTP error! Status: ${response.status}`); throw new Error(`HTTP error! Status: ${response.status}`)
// Blob // Blob
const blob = await response.blob(); const blob = await response.blob()
// a // a
const link = document.createElement("a"); const link = document.createElement('a')
link.href = URL.createObjectURL(blob); link.href = URL.createObjectURL(blob)
link.download = item.imgName; // link.download = item.imgName //
link.style.display = "none"; // link.style.display = 'none' //
// DOM // DOM
document.body.appendChild(link); document.body.appendChild(link)
// //
link.click(); link.click()
// //
URL.revokeObjectURL(link.href); URL.revokeObjectURL(link.href)
document.body.removeChild(link); document.body.removeChild(link)
} }
catch (error) { catch (error) {
console.error("下载图片时发生错误:", error); console.error('下载图片时发生错误:', error)
} }
} }
function previewHandler(index: number, event: MouseEvent) { function previewHandler(index: number, event: MouseEvent) {
event.stopImmediatePropagation(); event.stopImmediatePropagation()
event.stopPropagation(); event.stopPropagation()
if (imageRef.value?.[index] && (imageRef.value[index] as any).src) if (imageRef.value?.[index] && (imageRef.value[index] as any).src)
// (imageRef.value?.[index] as any).mergedOnClick(); // (imageRef.value?.[index] as any).mergedOnClick();
(imageRef.value?.[index] as any).click(); (imageRef.value?.[index] as any).click()
} }
/** /**
@ -548,11 +544,11 @@ function previewHandler(index: number, event: MouseEvent) {
*/ */
function refresh(val?: any) { function refresh(val?: any) {
// delete asideVal.izsimilarity // delete asideVal.izsimilarity
const checkingTaskModal = checkingTaskModalRef.value as any; const checkingTaskModal = checkingTaskModalRef.value as any
if (checkDuplicateNo.value) { if (checkDuplicateNo.value) {
getCheckDuplicateStatus(checkDuplicateNo.value).then((res) => { getCheckDuplicateStatus(checkDuplicateNo.value).then((res) => {
if (res.code === "OK") { if (res.code === 'OK') {
checkTaskStatus.value = res.data.status; // 1. 2. checkTaskStatus.value = res.data.status // 1. 2.
// if (isRefresh.value === false) { // if (isRefresh.value === false) {
// const modal = packageModalRef.value as any // const modal = packageModalRef.value as any
// modal.showModal() // modal.showModal()
@ -563,27 +559,24 @@ function refresh(val?: any) {
(checkTaskStatus.value === 2 || checkTaskStatus.value === 3) (checkTaskStatus.value === 2 || checkTaskStatus.value === 3)
&& isRefresh.value && isRefresh.value
) { ) {
configStore.setTimeNum(100); configStore.setTimeNum(100)
checkingTaskModal.closeModal(); checkingTaskModal.closeModal()
isRefresh.value = false; isRefresh.value = false
if (checkTaskStatus.value === 2) if (checkTaskStatus.value === 2)
message.success("任务执行完毕,正在刷新数据..."); message.success('任务执行完毕,正在刷新数据...')
else else message.error('查询异常')
message.error("查询异常");
if (timer.value) if (timer.value)
clearInterval(timer.value); clearInterval(timer.value)
reset(); reset()
loadMore(); loadMore()
configStore.setTimeNum(0); configStore.setTimeNum(0)
} }
else if (checkTaskStatus.value === 1) { else if (checkTaskStatus.value === 1) {
} }
} }
}); })
} }
} }
/** /**
@ -592,12 +585,12 @@ function refresh(val?: any) {
function cancel() { function cancel() {
if (checkTaskStatus.value === 1) { if (checkTaskStatus.value === 1) {
removeCheckDuplicate(checkDuplicateNo.value).then((res) => { removeCheckDuplicate(checkDuplicateNo.value).then((res) => {
if (res.code === "OK") { if (res.code === 'OK') {
checkDuplicateNo.value = ""; checkDuplicateNo.value = ''
checkTaskStatus.value = null; checkTaskStatus.value = null
message.success("查重任务取消成功"); message.success('查重任务取消成功')
} }
}); })
} }
} }
@ -605,36 +598,31 @@ function renderIcon(icon: Component) {
return () => { return () => {
return h(NIcon, null, { return h(NIcon, null, {
default: () => h(icon), default: () => h(icon),
}); })
}; }
} }
const dropdownOptions = ref([ const dropdownOptions = ref([
{ {
label: "导入任务数据", label: '导入任务数据',
key: "profile", key: 'profile',
icon: renderIcon(UploadIcon), icon: renderIcon(UploadIcon),
}, },
{ {
label: "导出任务数据", label: '导出任务数据',
key: "editProfile", key: 'editProfile',
icon: renderIcon(DownloadIcon), icon: renderIcon(DownloadIcon),
}, },
{ {
label: "查看导入记录", label: '查看导入记录',
key: "logout", key: 'logout',
icon: renderIcon(EyeOutlineIcon), icon: renderIcon(EyeOutlineIcon),
}, },
]); ])
function loadImgOver(item) {
console.log("loadImgOver", item);
setTimeout(() => (item.loadOver = true), 2000);
}
defineExpose({ defineExpose({
showLoginSuccessModal, showLoginSuccessModal,
}); })
</script> </script>
<template> <template>

Loading…
Cancel
Save