Merge branch 'main' into shen

bak
Dragon 1 year ago
commit fd699b5949

@ -270,16 +270,16 @@ defineExpose({
<n-input v-model:value="formValue.name" :style="{ width: '780px' }" @keydown.enter.prevent /> <n-input v-model:value="formValue.name" :style="{ width: '780px' }" @keydown.enter.prevent />
</n-form-item> </n-form-item>
<n-form-item path="logic" label="逻辑关系"> <n-form-item path="logic" label="逻辑关系">
<n-select v-model:value="formValue.logic" placeholder="请选择逻辑关系" :options="logicOptions" /> <n-select filterable v-model:value="formValue.logic" placeholder="请选择逻辑关系" :options="logicOptions" />
</n-form-item> </n-form-item>
<n-form-item <n-form-item
v-for="(item, index) in formValue.conditions" :key="index" :style="formItemStyle" v-for="(item, index) in formValue.conditions" :key="index" :style="formItemStyle"
path="conditions" :label="formLabel(index)" path="conditions" :label="formLabel(index)"
> >
<n-select <n-select filterable
v-model:value="item.type" placeholder="请选择筛选项名称" :options="typeOptions" v-model:value="item.type" placeholder="请选择筛选项名称" :options="typeOptions"
/> />
<n-select <n-select filterable
v-model:value="item.operator" style="margin-left: 8px;" placeholder="请选择" v-model:value="item.operator" style="margin-left: 8px;" placeholder="请选择"
:options="operatorOptions" :options="operatorOptions"
/> />
@ -289,7 +289,7 @@ defineExpose({
clearable clearable
/> />
</n-space> </n-space>
<n-select <n-select filterable
v-else v-model:value="item.result" style="margin-left: 8px;" placeholder="请选择" :options="getOptions(item.type!)" v-else v-model:value="item.result" style="margin-left: 8px;" placeholder="请选择" :options="getOptions(item.type!)"
/> />
<n-button :style="noBorderInput" icon-placement="right" @click="removeCondition(index)"> <n-button :style="noBorderInput" icon-placement="right" @click="removeCondition(index)">

@ -78,11 +78,11 @@ onBeforeMount(async () => {
</div> </div>
<div class="wrapper-content"> <div class="wrapper-content">
<span>处理方式</span> <span>处理方式</span>
<n-select v-model:value="selectBackId" style="margin-top: 10px;" :options="backOptions" /> <n-select filterable v-model:value="selectBackId" style="margin-top: 10px;" :options="backOptions" />
</div> </div>
<div class="wrapper-content"> <div class="wrapper-content">
<span>不通过原因</span> <span>不通过原因</span>
<n-select v-model:value="selectRejectId" style="margin-top: 10px;" :options="reasonOptions" /> <n-select filterable v-model:value="selectRejectId" style="margin-top: 10px;" :options="reasonOptions" />
<n-input v-show="showOther" v-model:value="otherValue" type="textarea" placeholder="备注内容" style="margin-top: 10px;" /> <n-input v-show="showOther" v-model:value="otherValue" type="textarea" placeholder="备注内容" style="margin-top: 10px;" />
</div> </div>
</div> </div>

@ -1,13 +1,13 @@
<script lang="ts" setup> <script lang="ts" setup>
import { favorite, getConditionList, unfavorite } from '@/api/home/filter' import { favorite, getConditionList, unfavorite } from "@/api/home/filter";
import { asideMap } from '@/config/aside' import { asideMap } from "@/config/aside";
import { useInfiniteScroll } from '@vueuse/core' import { useInfiniteScroll } from "@vueuse/core";
import { debounce } from 'lodash-es' import { debounce } from "lodash-es";
import { onMounted, reactive, ref } 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";
defineOptions({ name: 'AdvanceFilter' }) defineOptions({ name: "AdvanceFilter" });
const props = defineProps({ const props = defineProps({
type: { type: {
@ -15,109 +15,115 @@ 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 data = ref<FilterEntity[]>([]) const data = ref<FilterEntity[]>([]);
let loading = false let loading = 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("");
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,
filterList: [{ filterList: [
key, {
value: defaultValue, key,
}], value: defaultValue,
} },
return [...acc, config] ],
} };
else { return [...acc, config];
return acc } else {
return acc;
} }
}, []) }, []);
} }
useInfiniteScroll( useInfiniteScroll(
el as any, el as any,
() => { () => {
loadMore() loadMore();
}, },
{ distance: 10, interval: 300, canLoadMore: () => false }, { distance: 10, interval: 300, canLoadMore: () => false }
) );
const showClick = ()=>{
console.log('showClick')
inputHandler('')
}
async function loadMore() { async function loadMore() {
if (loading || el.value == null) if (loading || 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 = true loading = true;
try { try {
const searchParam: FilterSearchParam = { search_searchname: { value: keyword.value, op: 'like', type: 'string' } } const searchParam: FilterSearchParam = {
const result = await getConditionList(pagination, searchParam, props.type) search_searchname: { value: keyword.value, op: "like", type: "string" },
const { data } = result };
const result = await getConditionList(pagination, searchParam, props.type);
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 {
} loading = false;
finally {
loading = false
} }
} }
// //
function generateFilterEntityList(data) { function generateFilterEntityList(data) {
const filterEntityList = data.map((item) => { const filterEntityList = data.map((item) => {
const { searchname, iztop, ocrUsersearchchildList, id } = item const { searchname, iztop, ocrUsersearchchildList, id } = 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(keyword.value, 'gi') const reg = new RegExp(keyword.value, "gi");
const hilightText = searchname.replace(reg, `<span style='color:#FF0000'>${keyword.value}</span>`) const hilightText = searchname.replace(
reg,
`<span style='color:#FF0000'>${keyword.value}</span>`
);
return { return {
id, id,
@ -125,45 +131,45 @@ function generateFilterEntityList(data) {
favorite: iztop, favorite: iztop,
isDefaultFilter: false, isDefaultFilter: false,
filterList: list, filterList: list,
} };
}) });
return filterEntityList return filterEntityList;
} }
function selectHandler(item: FilterEntity) { function selectHandler(item: FilterEntity) {
(popover.value as any).setShow(false) (popover.value as any).setShow(false);
emit('select', item.id) emit("select", item.id);
} }
const inputHandler = debounce((word) => { const inputHandler = debounce((word) => {
keyword.value = word keyword.value = word;
featchList().then((list) => { featchList().then((list) => {
data.value = list data.value = list;
}) });
}, 300) }, 300);
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);
} }
} }
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);
} }
} }
</script> </script>
@ -173,29 +179,58 @@ function unFavoriteHandler(event: MouseEvent, item) {
<div class="wrapper-left"> <div class="wrapper-left">
<svg-icon name="shield" size="32" /> <svg-icon name="shield" size="32" />
<n-popover <n-popover
ref="popover" :style="{ padding: '0px' }" style="width: 248px" :show-arrow="false" ref="popover"
placement="bottom-start" trigger="click" :style="{ padding: '0px' }"
style="width: 248px"
:show-arrow="false"
placement="bottom-start"
trigger="click"
> >
<template #trigger> <template #trigger>
<div class="wrapper-left-dropdown"> <div class="wrapper-left-dropdown" @click="showClick">
<span>高级筛选</span> <span>高级筛选</span>
<SvgIcon :style="{ marginLeft: '5px' }" name="down" size="14" /> <SvgIcon :style="{ marginLeft: '5px' }" name="down" size="14" />
</div> </div>
</template> </template>
<n-spin :show="loading"> <n-spin :show="loading">
<div class="wrapper-left-popover"> <div class="wrapper-left-popover">
<n-input :style="{ '--n-border': '0px' }" placeholder="请输入关键字" @input="inputHandler"> <n-input
:style="{ '--n-border': '0px' }"
placeholder="请输入关键字"
@input="inputHandler"
>
<template #prefix> <template #prefix>
<SvgIcon size="14px" name="magnifying-1" /> <SvgIcon size="14px" name="magnifying-1" />
</template> </template>
<template #suffix> <template #suffix>
<SvgIcon size="14px" style="cursor: pointer;" name="setting" @click="emit('show-filter')" /> <SvgIcon
size="14px"
style="cursor: pointer"
name="setting"
@click="emit('show-filter')"
/>
</template> </template>
</n-input> </n-input>
<ul ref="el" class="wrapper-left-list"> <ul ref="el" class="wrapper-left-list">
<li v-for="(item, index) in data" :key="index" style="display: flex;align-items: center;" @click="selectHandler(item)"> <li
<SvgIcon v-if="item.favorite && !item.isDefaultFilter" name="favorite-fill" color="#fd9b0a" size="18" @click="unFavoriteHandler($event, item)" /> v-for="(item, index) in data"
<SvgIcon v-else-if="!item.favorite && !item.isDefaultFilter" name="favorite-unfill" size="18" @click="favoriteHandler($event, item)" /> :key="index"
style="display: flex; align-items: center"
@click="selectHandler(item)"
>
<SvgIcon
v-if="item.favorite && !item.isDefaultFilter"
name="favorite-fill"
color="#fd9b0a"
size="18"
@click="unFavoriteHandler($event, item)"
/>
<SvgIcon
v-else-if="!item.favorite && !item.isDefaultFilter"
name="favorite-unfill"
size="18"
@click="favoriteHandler($event, item)"
/>
<div v-html="item.name" /> <div v-html="item.name" />
</li> </li>
</ul> </ul>
@ -204,8 +239,18 @@ function unFavoriteHandler(event: MouseEvent, item) {
</n-popover> </n-popover>
</div> </div>
<div class="wrapper-right"> <div class="wrapper-right">
<SvgIcon style="display: block;cursor: pointer;" size="18" name="magnifying-1" @click="emit('update:search')" /> <SvgIcon
<SvgIcon style="display: block;cursor: pointer;margin-left: 10px;" size="18" name="filter" @click="emit('show-custom')" /> style="display: block; cursor: pointer"
size="18"
name="magnifying-1"
@click="emit('update:search')"
/>
<SvgIcon
style="display: block; cursor: pointer; margin-left: 10px"
size="18"
name="filter"
@click="emit('show-custom')"
/>
</div> </div>
</div> </div>
</template> </template>
@ -243,7 +288,7 @@ function unFavoriteHandler(event: MouseEvent, item) {
scrollbar-width: none; /* firefox */ scrollbar-width: none; /* firefox */
-ms-overflow-style: none; /* IE 10+ */ -ms-overflow-style: none; /* IE 10+ */
&::-webkit-scrollbar{ &::-webkit-scrollbar {
display: none; display: none;
} }

@ -45,7 +45,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访客户级别" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访客户级别" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -45,7 +45,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访客户名称" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访客户名称" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -45,7 +45,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访客户类型" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访客户类型" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -51,7 +51,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择izcustomtype" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择izcustomtype" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -45,7 +45,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择产品名称" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择产品名称" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -45,7 +45,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择所属项目" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择所属项目" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -45,7 +45,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访项目类别" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访项目类别" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -51,7 +51,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择IzSearch" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择IzSearch" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -51,7 +51,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择IzSearchManager" multiple :options="options" v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择IzSearchManager" multiple :options="options"
@update:value="onChange" @update:value="onChange"
/> />

@ -45,7 +45,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择分类" multiple :options="options" v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择分类" multiple :options="options"
@update:value="onChange" @update:value="onChange"
/> />

@ -45,7 +45,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择审核状态" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择审核状态" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -45,7 +45,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择发布地区" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择发布地区" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -51,7 +51,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访项目类别" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访项目类别" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -51,7 +51,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访客户类型" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访客户类型" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -51,7 +51,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访客户名称" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访客户名称" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -51,7 +51,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访客户级别" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择拜访客户级别" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -45,7 +45,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择厂商" multiple v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择厂商" multiple
:options="options" @update:value="onChange" :options="options" @update:value="onChange"
/> />

@ -45,7 +45,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择任务来源" multiple :options="options" v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择任务来源" multiple :options="options"
@update:value="onChange" @update:value="onChange"
/> />

@ -45,7 +45,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择任务状态" multiple :options="options" v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择任务状态" multiple :options="options"
@update:value="onChange" @update:value="onChange"
/> />

@ -45,7 +45,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择省份" multiple :options="options" v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择省份" multiple :options="options"
@update:value="onChange" @update:value="onChange"
/> />

@ -45,7 +45,7 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="plans" :label-style="labStyle"> <n-form-item :label="label" path="plans" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择计划" multiple :options="planOptons" v-model:value="formValue.plans" :max-tag-count="2" placeholder="请选择计划" multiple :options="planOptons"
@update:value="onChange" @update:value="onChange"
/> />

@ -45,7 +45,8 @@ function onChange(value: Array<string>) {
<template> <template>
<n-form :model="formValue" style="padding: 0px 10px;" :rules="rules"> <n-form :model="formValue" style="padding: 0px 10px;" :rules="rules">
<n-form-item :label="label" path="users" :label-style="labStyle"> <n-form-item :label="label" path="users" :label-style="labStyle">
<n-select <n-select filterable
v-model:value="formValue.users" :max-tag-count="2" multiple placeholder="请选择提报人(可多选)" v-model:value="formValue.users" :max-tag-count="2" multiple placeholder="请选择提报人(可多选)"
:options="personOptions" @update:value="onChange" :options="personOptions" @update:value="onChange"
/> />

@ -303,16 +303,16 @@ defineExpose({
<n-input v-model:value="formValue.name" :style="{ width: '780px' }" @keydown.enter.prevent /> <n-input v-model:value="formValue.name" :style="{ width: '780px' }" @keydown.enter.prevent />
</n-form-item> </n-form-item>
<n-form-item path="logic" label="逻辑关系"> <n-form-item path="logic" label="逻辑关系">
<n-select v-model:value="formValue.logic" placeholder="请选择逻辑关系" :options="logicOptions" /> <n-select filterable v-model:value="formValue.logic" placeholder="请选择逻辑关系" :options="logicOptions" />
</n-form-item> </n-form-item>
<n-form-item <n-form-item
v-for="(item, index) in formValue.conditions" :key="index" :style="formItemStyle" v-for="(item, index) in formValue.conditions" :key="index" :style="formItemStyle"
path="conditions" :label="formLabel(index)" path="conditions" :label="formLabel(index)"
> >
<n-select <n-select filterable
v-model:value="item.type" placeholder="请选择筛选项名称" :options="typeOptions" v-model:value="item.type" placeholder="请选择筛选项名称" :options="typeOptions"
/> />
<n-select <n-select filterable
v-model:value="item.operator" style="margin-left: 8px;" placeholder="请选择" v-model:value="item.operator" style="margin-left: 8px;" placeholder="请选择"
:options="operatorOptions" :options="operatorOptions"
/> />
@ -322,7 +322,7 @@ defineExpose({
clearable clearable
/> />
</n-space> </n-space>
<n-select <n-select filterable
v-else v-model:value="item.result" style="margin-left: 8px;" placeholder="请选择" :options="getOptions(item.type!)" v-else v-model:value="item.result" style="margin-left: 8px;" placeholder="请选择" :options="getOptions(item.type!)"
/> />
<n-button :style="noBorderInput" icon-placement="right" @click="removeCondition(index)"> <n-button :style="noBorderInput" icon-placement="right" @click="removeCondition(index)">

@ -23,7 +23,7 @@ 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('tile')
const pagination = reactive({ const pagination = reactive({
pageNo: 0, pageNo: 0,
pageSize: 30, pageSize: 30,
@ -449,6 +449,12 @@ function sortHandler() {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 12px;
font-family: PingFang SC, PingFang SC-Semibold;
font-weight: Semibold;
text-align: left;
color: #ffffff;
line-height: 24px;
} }
} }

@ -35,9 +35,12 @@ const show = ref(false)
const flag = ref(true) const flag = ref(true)
const formInline: FormState = reactive({ const formInline: FormState = reactive({
enterprisecode: '演示公司', // enterprisecode: '',
username: 'yanshi01', // username: 'yanshi01',
password: '123456', // password: '123456',
enterprisecode: '',
username: '',
password: '',
}) })
const formSms: FormSms = reactive({ const formSms: FormSms = reactive({

@ -1,13 +1,18 @@
<script lang="ts" setup> <script lang="ts" setup>
import { useTaskStore } from "@/store/modules/task"; import { useTaskStore } from "@/store/modules/task";
import { debounce } from "lodash-es"; import { debounce } from "lodash-es";
import { computed, onMounted, ref, unref, watch } from "vue"; import { computed, onMounted, ref, unref, watch,shallowRef } from "vue";
import CustomFieldModal from "../modal/CustomFieldModal.vue"; import CustomFieldModal from "../modal/CustomFieldModal.vue";
import type { AsideEntity } from '@/config/aside'
import { useUser } from "@/store/modules/user"; import { useUser } from "@/store/modules/user";
import { getAllfieldList, getfieldList, savefield } from "@/api/home/filter"; import { getAllfieldList, getfieldList, savefield } from "@/api/home/filter";
import TaskList from "./TaskList.vue"; import TaskList from "./TaskList.vue";
import AdvanceFilter from '../../home/aside/comp/AdvanceFilter.vue'
import emitter from '@/utils/mitt'
const CustomFieldModalRef = ref(null); const CustomFieldModalRef = ref(null);
const collapse = ref(false); const collapse = ref(false);
@ -110,6 +115,30 @@ async function getshowFieldList() {
onMounted(() => { onMounted(() => {
getshowFieldList(); getshowFieldList();
}); });
// key
function scrollHandler(key: string) {
const element = document.querySelector(`#${key}`)
element?.scrollIntoView(true)
}
//
function filterHandler(searchId: string) {
emitter.emit('filter', searchId)
}
function showModal(modalRef: any) {
const modal = unref(modalRef)! as any
modal.showModal()
}
//
const showItems = shallowRef<{ key: string, config: AsideEntity }[]>([])
const filterModalRef = ref(null)
const newFilterModalRef = ref(null)
const customModalRef = ref(null)
function editFilter(filter: any) {
const modal = unref(newFilterModalRef)! as any
modal.showModal()
modal.edit(filter)
}
</script> </script>
<template> <template>
@ -125,7 +154,7 @@ onMounted(() => {
</div> </div>
</div> </div>
<div class="aside-header"> <div class="aside-header">
<div v-show="!showSearch" class="warpper"> <!-- <div v-show="!showSearch" class="warpper">
<div class="left"> <div class="left">
<svg-icon name="all-worksheet" size="32" /> <svg-icon name="all-worksheet" size="32" />
<span style="margin-left: 8px">所有请求</span> <span style="margin-left: 8px">所有请求</span>
@ -144,7 +173,13 @@ onMounted(() => {
@click="showFilter" @click="showFilter"
/> />
</div> </div>
</div> </div> -->
<!-- 高级筛选 -->
<AdvanceFilter
v-show="!showSearch" :type="2" @select="filterHandler" @update:search="setShowSearch(true)"
@show-custom="showModal(customModalRef)" @show-filter="showModal(filterModalRef)"
/>
<div v-show="showSearch" class="warpper"> <div v-show="showSearch" class="warpper">
<n-input <n-input
style="flex: 1; height: 32px" style="flex: 1; height: 32px"
@ -162,6 +197,7 @@ onMounted(() => {
@click="setShowSearch(false)" @click="setShowSearch(false)"
/> />
</div> </div>
</div> </div>
<TaskList <TaskList
ref="taskListRef" ref="taskListRef"

@ -39,7 +39,7 @@ const svgName = computed(() => {
任务ID:{{ listItem.fromtaskname }} 任务ID:{{ listItem.fromtaskname }}
</span> </span>
</div> </div>
<SvgIcon v-show="selected" size="14" name="more-ver" /> <!-- <SvgIcon v-show="selected" size="14" name="more-ver" /> -->
</div> </div>
<ul class="list-item-detail" v-else> <ul class="list-item-detail" v-else>
<li v-if="item.id == 'statshisText'"> <li v-if="item.id == 'statshisText'">

@ -238,6 +238,7 @@ watch(
if (isEmpty(taskId)) if (isEmpty(taskId))
return return
taskDetailInfo.value = await getTaskDetailInfo(taskId, packageid) taskDetailInfo.value = await getTaskDetailInfo(taskId, packageid)
console.log(taskDetailInfo.value,'taskDetailInfo')
getTableData() getTableData()
// TODO mock // TODO mock
// let showFieldData = taskDetailInfo.value.ocrPicture; // let showFieldData = taskDetailInfo.value.ocrPicture;
@ -282,6 +283,10 @@ const currentTaskId = computed(() => {
function overTaskHandle() { function overTaskHandle() {
const item = taskDetailInfo.value const item = taskDetailInfo.value
if(item?.userapprove?.statshis == 2 || item?.userapprove?.statshis == 3){
overTask.value = null;
return
}
if (validate([item]) == null && batch.value === false) if (validate([item]) == null && batch.value === false)
overTask.value = item overTask.value = item

@ -86,11 +86,11 @@ async function selectChange(id){
</div> </div>
<div class="wrapper-content"> <div class="wrapper-content">
<span>处理方式</span> <span>处理方式</span>
<n-select v-model:value="selectBackId" style="margin-top: 10px;" :options="backOptions" /> <n-select filterable v-model:value="selectBackId" style="margin-top: 10px;" :options="backOptions" />
</div> </div>
<div class="wrapper-content"> <div class="wrapper-content">
<span>不通过原因</span> <span>不通过原因</span>
<n-select v-model:value="selectRejectId" @change="selectChange" style="margin-top: 10px;" :options="reasonOptions" /> <n-select filterable v-model:value="selectRejectId" @change="selectChange" style="margin-top: 10px;" :options="reasonOptions" />
<n-input v-show="showOther" v-model:value="otherValue" type="textarea" placeholder="备注内容" style="margin-top: 10px;" /> <n-input v-show="showOther" v-model:value="otherValue" type="textarea" placeholder="备注内容" style="margin-top: 10px;" />
</div> </div>

@ -19,7 +19,7 @@ const props = defineProps({
}, },
}); });
console.log(props.listItem,'listItem') console.log(props.listItem, "listItem");
const svgName = computed(() => { const svgName = computed(() => {
return props.selected ? "taskpack-select" : "taskpack"; return props.selected ? "taskpack-select" : "taskpack";
}); });
@ -37,14 +37,18 @@ const svgName = computed(() => {
> >
{{ listItem.packagename }} {{ listItem.packagename }}
</span> </span>
<span class="list-item-header-selected" <span class="list-item-header-selected">({{ listItem.pictureno }})</span>
>({{ listItem.pictureno }})</span
>
</div> </div>
<SvgIcon v-show="selected" size="14" name="more-ver" /> <!-- <SvgIcon v-show="selected" size="14" name="more-ver" /> -->
</div> </div>
<ul class="list-item-detail" v-else> <ul class="list-item-detail" v-else>
{{ item.name }}{{ listItem[item.id] }} <li>
{{
item.name
}}{{
listItem[item.id]
}}
</li>
</ul> </ul>
</div> </div>
<!-- <div class="list-item-header"> <!-- <div class="list-item-header">
@ -95,10 +99,15 @@ const svgName = computed(() => {
margin-left: 36px; margin-left: 36px;
li { li {
font-size: 13px;
color: #666666; color: #666666;
line-height: 18px; line-height: 18px;
margin-bottom: 8px; margin-bottom: 8px;
font-size: 13px;
font-family: PingFang SC, PingFang SC-Regular;
font-weight: Regular;
text-align: left;
color: #666666;
line-height: 18px;
} }
} }

@ -1,77 +1,80 @@
<script lang="ts" setup> <script lang="ts" setup>
import { computed, onUnmounted, onUpdated, reactive, ref, unref, watch } from 'vue' import { computed, onUnmounted, onUpdated, reactive, ref, unref, watch } from "vue";
import { useDialog, useMessage } from 'naive-ui' import { useDialog, useMessage } from "naive-ui";
import { clone, debounce, pickBy } from 'lodash-es' import { clone, debounce, pickBy } from "lodash-es";
import { useInfiniteScroll } from '@vueuse/core' import { useInfiniteScroll } from "@vueuse/core";
import imagesloaded from 'imagesloaded' import imagesloaded from "imagesloaded";
import ConfrimModal from '../modal/ConfrimModal.vue' import ConfrimModal from "../modal/ConfrimModal.vue";
import type { PictureSortParam, SetTFParam } from '/#/api' import type { PictureSortParam, SetTFParam } from "/#/api";
import { useWorkOrder } from '@/store/modules/workOrder' import { useWorkOrder } from "@/store/modules/workOrder";
import { clearTF, getPackageTaskList, getTaskDetailInfo, getTaskDetailPictureList, setTF } from '@/api/work/work' import { formatToDateHMS } from '@/utils/dateUtil'
import { fieldMap } from '@/config/workorder' import {
import { hideDownload } from '@/utils/image' clearTF,
import { isEmpty } from '@/utils' getPackageTaskList,
getTaskDetailInfo,
const batch = ref(false) getTaskDetailPictureList,
const selectItems = ref<any[]>([]) setTF,
const message = useMessage() } from "@/api/work/work";
const dialog = useDialog() import { fieldMap } from "@/config/workorder";
const totalCount = ref(0) import { hideDownload } from "@/utils/image";
let _imagesload: any import { isEmpty } from "@/utils";
const batch = ref(false);
const selectItems = ref<any[]>([]);
const message = useMessage();
const dialog = useDialog();
const totalCount = ref(0);
let _imagesload: any;
function setBatch(value: boolean) { function setBatch(value: boolean) {
batch.value = value batch.value = value;
if (value === false) { if (value === false) {
selectItems.value.forEach(item => item.checked = false) selectItems.value.forEach((item) => (item.checked = false));
selectItems.value.length = 0 selectItems.value.length = 0;
} }
} }
function onCheckChange(checked: any, item: any) { function onCheckChange(checked: any, item: any) {
const index = selectItems.value.indexOf(item) const index = selectItems.value.indexOf(item);
item.checked = checked item.checked = checked;
if (index === -1 && checked) if (index === -1 && checked) selectItems.value.push(item);
selectItems.value.push(item) else selectItems.value.splice(index, 1);
else
selectItems.value.splice(index, 1)
} }
const showActions = computed(() => { const showActions = computed(() => {
return selectItems.value.length > 0 && batch return selectItems.value.length > 0 && batch;
}) });
const packagepagination = reactive({ const packagepagination = reactive({
pageNo: 1, pageNo: 1,
pageSize: 10, pageSize: 10,
}) });
const taskpagination = reactive({ const taskpagination = reactive({
pageNo: 1, pageNo: 1,
pageSize: 10, pageSize: 10,
}) });
const sortBy: PictureSortParam = { const sortBy: PictureSortParam = {
orderbyname: 'asc', orderbyname: "asc",
orderbyvalue: 'pictureResult', orderbyvalue: "pictureResult",
} };
const workStore = useWorkOrder() const workStore = useWorkOrder();
const selectTask = ref<any>(null) const selectTask = ref<any>(null);
const overTask = ref<any>(null) const overTask = ref<any>(null);
const taskList = ref<any[]>([]) const taskList = ref<any[]>([]);
const taskDetailInfo = ref<any>({}) const taskDetailInfo = ref<any>({});
const confrimModalRef = ref(null) const confrimModalRef = ref(null);
const imageRef = ref<ComponentElRef | null>() const imageRef = ref<ComponentElRef | null>();
const listData = ref<any[]>([]) const listData = ref<any[]>([]);
const loading = ref(false) const loading = ref(false);
const el = ref<HTMLDivElement | null>(null) const el = ref<HTMLDivElement | null>(null);
let canloadMore = true let canloadMore = true;
let processItems: any[] = [] let processItems: any[] = [];
function validate(items: any[]) { function validate(items: any[]) {
if (items.length === 0) if (items.length === 0) return "至少选中一个任务";
return '至少选中一个任务'
// for (const item of items) { // for (const item of items) {
// const { iztrueorfalse, history, states } = item // const { iztrueorfalse, history, states } = item
@ -85,304 +88,302 @@ function validate(items: any[]) {
// return '' // return ''
// } // }
return null return null;
} }
function falseHandler() { function falseHandler() {
let cloneItem: any let cloneItem: any;
if (batch.value) { processItems = selectItems.value } if (batch.value) {
else if (overTask.value) { processItems = selectItems.value;
cloneItem = clone(overTask.value) } else if (overTask.value) {
processItems = [cloneItem] cloneItem = clone(overTask.value);
processItems = [cloneItem];
} }
const msg = validate(processItems) const msg = validate(processItems);
if (msg !== null) { if (msg !== null) {
message.error(msg) message.error(msg);
return return;
} }
const modal = unref(confrimModalRef)! as any const modal = unref(confrimModalRef)! as any;
modal.showModal() modal.showModal();
} }
function trueHandler() { function trueHandler() {
let cloneItem: any let cloneItem: any;
if (batch.value) { processItems = selectItems.value } if (batch.value) {
else if (overTask.value) { processItems = selectItems.value;
cloneItem = clone(overTask.value) } else if (overTask.value) {
processItems = [cloneItem] cloneItem = clone(overTask.value);
processItems = [cloneItem];
} }
const msg = validate(processItems) const msg = validate(processItems);
if (msg !== null) { if (msg !== null) {
message.error(msg) message.error(msg);
return return;
} }
dialog.info({ dialog.info({
title: '确认提示', title: "确认提示",
content: '确认给该任务图判真吗?', content: "确认给该任务图判真吗?",
positiveText: '确定', positiveText: "确定",
negativeText: '取消', negativeText: "取消",
onPositiveClick: () => { onPositiveClick: () => {
setTrue() setTrue();
}, },
onNegativeClick: () => { }, onNegativeClick: () => {},
}) });
} }
function setTrue() { function setTrue() {
const ids: any[] = processItems.map(item => item.id) const ids: any[] = processItems.map((item) => item.id);
const param: SetTFParam = { const param: SetTFParam = {
taskchildpictureids: ids.join(','), taskchildpictureids: ids.join(","),
iztrueorfalse: 1, iztrueorfalse: 1,
packageid: workStore.getActiveId, packageid: workStore.getActiveId,
judgeid: '0', judgeid: "0",
} };
doSetTF(param) doSetTF(param);
} }
function setFalse(id: string, desc: null | string) { function setFalse(id: string, desc: null | string) {
const ids: any[] = processItems.map(item => item.id) const ids: any[] = processItems.map((item) => item.id);
const param: SetTFParam = { const param: SetTFParam = {
taskchildpictureids: ids.join(','), taskchildpictureids: ids.join(","),
iztrueorfalse: 0, iztrueorfalse: 0,
packageid: workStore.getActiveId, packageid: workStore.getActiveId,
judgeid: id, judgeid: id,
} };
if (desc) if (desc) param.judgedesc = desc;
param.judgedesc = desc
doSetTF(param) doSetTF(param);
} }
function doSetTF(param: SetTFParam) { function doSetTF(param: SetTFParam) {
setTF(param).then((res) => { setTF(param).then((res) => {
const { code } = res const { code } = res;
processItems.length = 0 processItems.length = 0;
if (code === 'OK') if (code === "OK") updateList(param);
updateList(param) else message.error(res.message);
else });
message.error(res.message)
})
} }
function updateList(param: SetTFParam) { function updateList(param: SetTFParam) {
const list = listData.value const list = listData.value;
const ids = param.taskchildpictureids.split(',') const ids = param.taskchildpictureids.split(",");
for (const item of list) { for (const item of list) {
if (ids.includes(item.id)) if (ids.includes(item.id)) item.iztrueorfalse = param.iztrueorfalse;
item.iztrueorfalse = param.iztrueorfalse
} }
if (ids.includes(taskDetailInfo.value.id)) if (ids.includes(taskDetailInfo.value.id))
taskDetailInfo.value.iztrueorfalse = param.iztrueorfalse taskDetailInfo.value.iztrueorfalse = param.iztrueorfalse;
} }
function forwardHandler() { function forwardHandler() {
workStore.forward() workStore.forward();
} }
function backHandler() { function backHandler() {
workStore.back() workStore.back();
} }
function reset() { function reset() {
taskpagination.pageNo = 0 taskpagination.pageNo = 0;
taskpagination.pageSize = 20 taskpagination.pageSize = 20;
listData.value.length = 0 listData.value.length = 0;
loading.value = false loading.value = false;
canloadMore = true canloadMore = true;
} }
async function refreshHandler() { async function refreshHandler() {
reset() reset();
useInfiniteScroll( useInfiniteScroll(
el as any, el as any,
() => { () => {
loadMore() loadMore();
}, },
{ distance: 10, canLoadMore: () => canloadMore }, { distance: 10, canLoadMore: () => canloadMore }
) );
} }
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();
listData.value.push(...more) listData.value.push(...more);
} }
async function featchList() { async function featchList() {
loading.value = true loading.value = true;
try { try {
taskpagination.pageNo += 1 taskpagination.pageNo += 1;
const taskId = selectTask.value.id const taskId = selectTask.value.id;
const { data, total, pageCount } = await getTaskDetailPictureList(workStore.activeId, taskId, { ...taskpagination, ...sortBy }) const { data, total, pageCount } = await getTaskDetailPictureList(
totalCount.value = total workStore.activeId,
canloadMore = pageCount >= taskpagination.pageNo && pageCount > 0 taskId,
{ ...taskpagination, ...sortBy }
return data );
} totalCount.value = total;
catch (error) { canloadMore = pageCount >= taskpagination.pageNo && pageCount > 0;
canloadMore = false
return [] return data;
} catch (error) {
canloadMore = false;
return [];
} }
} }
const layout = debounce(() => { const layout = debounce(() => {
if (el.value == null) if (el.value == null) return;
return
_imagesload = imagesloaded('.grid-item') _imagesload = imagesloaded(".grid-item");
_imagesload.on('done', (instance) => { _imagesload.on("done", (instance) => {
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);
onUpdated(() => { onUpdated(() => {
layout() layout();
}) });
watch(() => workStore.activeId, async (newValue, oldValue) => { watch(
const packageid = workStore.getActiveId () => workStore.activeId,
async (newValue, oldValue) => {
const packageid = workStore.getActiveId;
if (isEmpty(packageid)) {
listData.value.length = 0;
totalCount.value = 0;
return;
}
if (isEmpty(packageid)) { const res = await getPackageTaskList(newValue, packagepagination);
listData.value.length = 0 const { data } = res;
totalCount.value = 0 taskList.value = data;
return if (taskList.value.length > 0) handleSelect(taskList.value[0]);
} }
);
const res = await getPackageTaskList(newValue, packagepagination)
const { data } = res
taskList.value = data
if (taskList.value.length > 0)
handleSelect(taskList.value[0])
})
const packageName = computed(() => { const packageName = computed(() => {
const index = workStore.getCurrentIndex const index = workStore.getCurrentIndex;
return workStore.getOrderList[index]?.packagename || '' return workStore.getOrderList[index]?.packagename || "";
}) });
async function handleSelect(item: any) { async function handleSelect(item: any) {
selectTask.value = item selectTask.value = item;
const taskId = item.id const taskId = item.id;
taskDetailInfo.value = await getTaskDetailInfo(taskId, workStore.activeId) taskDetailInfo.value = await getTaskDetailInfo(taskId, workStore.activeId);
const packageid = workStore.getActiveId const packageid = workStore.getActiveId;
if (isEmpty(packageid)) { if (isEmpty(packageid)) {
listData.value.length = 0 listData.value.length = 0;
totalCount.value = 0 totalCount.value = 0;
return return;
} }
refreshHandler() refreshHandler();
} }
async function sortHandler(orderby: 'pictureResult' | 'fromuptime') { async function sortHandler(orderby: "pictureResult" | "fromuptime") {
if (!selectTask.value) if (!selectTask.value) return;
return
sortBy.orderbyvalue = orderby sortBy.orderbyvalue = orderby;
sortBy.orderbyname = sortBy.orderbyname === 'asc' ? 'desc' : 'asc' sortBy.orderbyname = sortBy.orderbyname === "asc" ? "desc" : "asc";
refreshHandler() refreshHandler();
} }
const propertys = computed(() => { const propertys = computed(() => {
const { ocrPicture } = taskDetailInfo.value const { ocrPicture } = taskDetailInfo.value;
const v = pickBy(ocrPicture, (value, key: string) => { const v = pickBy(ocrPicture, (value, key: string) => {
return key.startsWith('field') && value !== null return key.startsWith("field") && value !== null;
}) });
return v return v;
}) });
async function clearHandler() { async function clearHandler() {
dialog.info({ dialog.info({
title: '确认提示', title: "确认提示",
content: '确认给该任务图片的标记印记吗?', content: "确认给该任务图片的标记印记吗?",
positiveText: '确定', positiveText: "确定",
negativeText: '取消', negativeText: "取消",
onPositiveClick: () => { onPositiveClick: () => {
clearMark() clearMark();
}, },
onNegativeClick: () => { }, onNegativeClick: () => {},
}) });
} }
async function clearMark() { async function clearMark() {
const res = await clearTF(workStore.activeId, selectTask.value.id) const res = await clearTF(workStore.activeId, selectTask.value.id);
if (res.code === 'OK') { if (res.code === "OK") {
taskDetailInfo.value.iztrueorfalse = null taskDetailInfo.value.iztrueorfalse = null;
message.info('清除标记成功') message.info("清除标记成功");
} else {
message.error(res.message);
} }
else { message.error(res.message) }
} }
function overTaskHandelr(item: any) { function overTaskHandelr(item: any) {
if (validate([item]) == null && batch.value === false) if (validate([item]) == null && batch.value === false) overTask.value = item;
overTask.value = item
} }
function leaveTaskHandler() { function leaveTaskHandler() {
overTask.value = null overTask.value = null;
} }
onUnmounted(() => { onUnmounted(() => {
workStore.reset() workStore.reset();
}) });
function getPercent(pictureid: string) { function getPercent(pictureid: string) {
const { ocpictureid, pictureresult } = taskDetailInfo.value const { ocpictureid, pictureresult } = taskDetailInfo.value;
const index = ocpictureid.split(',').indexOf(String(pictureid)) const index = ocpictureid.split(",").indexOf(String(pictureid));
const results = pictureresult.split(',') const results = pictureresult.split(",");
const percent = results[index] || '0' const percent = results[index] || "0";
const val = Math.floor(Number.parseFloat(percent)) const val = Math.floor(Number.parseFloat(percent));
return `${val}%` return `${val}%`;
} }
const mark = computed(() => { const mark = computed(() => {
return taskDetailInfo.value.iztrueorfalse === null ? '未标记' : '已标记' return taskDetailInfo.value.iztrueorfalse === null ? "未标记" : "已标记";
}) });
function immersionHandler() { function immersionHandler() {
workStore.updateImmersion() workStore.updateImmersion();
} }
function showAction() { function showAction() {
const item = taskDetailInfo.value const item = taskDetailInfo.value;
if (batch.value === false) if (batch.value === false) overTask.value = item;
overTask.value = item
} }
function hideAction() { function hideAction() {
overTask.value = null overTask.value = null;
} }
function previewHandler(event: MouseEvent) { function previewHandler(event: MouseEvent) {
event.stopImmediatePropagation() event.stopImmediatePropagation();
event.stopPropagation() event.stopPropagation();
if (imageRef.value && (imageRef.value as any).src) if (imageRef.value && (imageRef.value as any).src)
(imageRef.value as any).mergedOnClick() (imageRef.value as any).mergedOnClick();
} }
</script> </script>
@ -395,16 +396,21 @@ function previewHandler(event: MouseEvent) {
<SvgIcon size="22" class="back" name="arrow-right" @click="forwardHandler" /> <SvgIcon size="22" class="back" name="arrow-right" @click="forwardHandler" />
</div> </div>
<div class="right"> <div class="right">
<div v-show="!showActions" style="display: flex;align-items: center;"> <div v-show="!showActions" style="display: flex; align-items: center">
<n-button text @click="clearHandler"> <n-button text @click="clearHandler">
<SvgIcon size="12" name="delete" /> <SvgIcon size="12" name="delete" />
清除标记 清除标记
</n-button> </n-button>
<div class="btn" style="margin: 0px 10px;" @click="setBatch(true)"> <div class="btn" style="margin: 0px 10px" @click="setBatch(true)">
<SvgIcon style="margin-right: 6px;" size="14" name="tf" /> <SvgIcon style="margin-right: 6px" size="14" name="tf" />
辨别真假 辨别真假
</div> </div>
<SvgIcon style="cursor: pointer;" size="20" name="immersion-model" @click="immersionHandler" /> <SvgIcon
style="cursor: pointer"
size="20"
name="immersion-model"
@click="immersionHandler"
/>
</div> </div>
<div v-show="showActions" class="batch"> <div v-show="showActions" class="batch">
@ -414,11 +420,11 @@ function previewHandler(event: MouseEvent) {
</template> </template>
返回 返回
</n-button> </n-button>
<div style="cursor: pointer;margin-left: 16px;" @click="falseHandler"> <div style="cursor: pointer; margin-left: 16px" @click="falseHandler">
<SvgIcon width="64" height="28" name="t4" /> <SvgIcon width="64" height="28" name="t4" />
</div> </div>
<SvgIcon size="24" name="vs" /> <SvgIcon size="24" name="vs" />
<div style="cursor: pointer;" @click="trueHandler"> <div style="cursor: pointer" @click="trueHandler">
<SvgIcon width="64" height="28" name="t3" /> <SvgIcon width="64" height="28" name="t3" />
</div> </div>
</div> </div>
@ -428,34 +434,64 @@ function previewHandler(event: MouseEvent) {
<div ref="el" class="scroll"> <div ref="el" class="scroll">
<div class="wrapper-detail"> <div class="wrapper-detail">
<div <div
class="left" :style="{ 'background-image': `url(${taskDetailInfo?.ocrPicture?.imgurl})` }" class="left"
@click="showAction" @mouseleave="leaveTaskHandler" :style="{ 'background-image': `url(${taskDetailInfo?.ocrPicture?.imgurl})` }"
@click="showAction"
@mouseleave="leaveTaskHandler"
> >
<!-- 真假标记 --> <!-- 真假标记 -->
<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>
<div class="mark"> <div class="mark">
<SvgIcon v-show="taskDetailInfo?.iztrueorfalse === 1" size="128" name="zhen" /> <SvgIcon
v-show="taskDetailInfo?.iztrueorfalse === 1"
size="128"
name="zhen"
/>
</div> </div>
<div class="time">
<SvgIcon color="#FFF" size="16" name="time" />
<span>{{ formatToDateHMS(taskDetailInfo.createdate || 0) }}</span>
</div>
<!-- 右下信息 --> <!-- 右下信息 -->
<div class="info"> <div class="info">
<n-grid x-gap="16" y-gap="0" :cols="12"> <n-grid x-gap="16" y-gap="0" :cols="12">
<n-gi span="4"> <n-gi span="4">
<span style="color:#8b8d8f;"> <span style="color: #8b8d8f">
<SvgIcon name="m1" /> <SvgIcon name="m1" />
</span> </span>
</n-gi> </n-gi>
<n-gi span="8" style="display: flex;align-items: left;flex-direction: column;justify-content: center;"> <n-gi
span="8"
style="
display: flex;
align-items: left;
flex-direction: column;
justify-content: center;
"
>
<span>{{ mark }}</span> <span>{{ mark }}</span>
<span>图片标记</span> <span>图片标记</span>
</n-gi> </n-gi>
<n-gi span="4"> <n-gi span="4">
<span style="color:#8b8d8f;"> <span style="color: #8b8d8f">
<SvgIcon name="m2" /> <SvgIcon name="m2" />
</span> </span>
</n-gi> </n-gi>
<n-gi span="8" style="display: flex;align-items: left;flex-direction: column;justify-content: center;"> <n-gi
span="8"
style="
display: flex;
align-items: left;
flex-direction: column;
justify-content: center;
"
>
<span>{{ totalCount }}</span> <span>{{ totalCount }}</span>
<span>相似匹配</span> <span>相似匹配</span>
</n-gi> </n-gi>
@ -466,65 +502,88 @@ function previewHandler(event: MouseEvent) {
<SvgIcon size="30" name="zoom-out" /> <SvgIcon size="30" name="zoom-out" />
</div> </div>
<!-- 预览大图组件 --> <!-- 预览大图组件 -->
<div style="display: none;"> <div style="display: none">
<n-image <n-image
ref="imageRef" :img-props="{ onClick: hideDownload }" ref="imageRef"
:img-props="{ onClick: hideDownload }"
:src="taskDetailInfo?.ocrPicture?.imgurl" :src="taskDetailInfo?.ocrPicture?.imgurl"
/> />
</div> </div>
<!-- 操作 --> <!-- 操作 -->
<div v-show="overTask && overTask.id === taskDetailInfo.id" class="action" @click.stop="hideAction"> <div
<SvgIcon style="cursor: pointer;" name="t1" @click.stop="trueHandler" /> v-show="overTask && overTask.id === taskDetailInfo.id"
<SvgIcon style="cursor: pointer;margin-left: 30px;" name="t2" @click.stop="falseHandler" /> class="action"
@click.stop="hideAction"
>
<SvgIcon style="cursor: pointer" name="t1" @click.stop="trueHandler" />
<SvgIcon
style="cursor: pointer; margin-left: 30px"
name="t2"
@click.stop="falseHandler"
/>
</div> </div>
</div> </div>
<div class="right"> <div class="right">
<n-scrollbar style="max-height: 100%;"> <n-scrollbar style="max-height: 100%">
<span class="name">图片名称</span> <span class="name">图片名称</span>
<div class="tags"> <div class="tags">
<div class="tag tag-actived"> <div class="tag tag-actived">重复图片</div>
重复图片 <div class="tag">基线任务</div>
</div>
<div class="tag">
基线任务
</div>
</div> </div>
<n-divider /> <n-divider />
<div class="property"> <div class="property">
<span class="property-name top" style="font-weight: bold;color: #333333;">拜访终端 <span class="property-name top" style="font-weight: bold; color: #333333"
>拜访终端
</span> </span>
<span style="font-weight: bold;color: #333333;font-size: 16px;">拜访终端</span> <span style="font-weight: bold; color: #333333; font-size: 16px"
>拜访终端</span
>
</div> </div>
<div v-for="(key) in Object.keys(propertys)" :key="key" class="property"> <div v-for="key in Object.keys(propertys)" :key="key" class="property">
<span class="property-name">{{ fieldMap[key] }}</span> <span class="property-name">{{ fieldMap[key] }}</span>
<span class="property-content ">{{ propertys[key] }}</span> <span class="property-content">{{ propertys[key] }}</span>
</div> </div>
</n-scrollbar> </n-scrollbar>
</div> </div>
</div> </div>
<div style="display: flex;justify-content: space-between;padding: 12px 0px;"> <div style="display: flex; justify-content: space-between; padding: 12px 0px">
<div><span style="font-size: 21px;font-weight: bold;">相似图片</span><span>({{ totalCount }})</span></div> <div>
<div style="display: flex;align-items: center;"> <span style="font-size: 21px; font-weight: bold">相似图片</span
<div style="cursor: pointer;" @click="sortHandler('fromuptime')"> ><span>({{ totalCount }})</span>
</div>
<div style="display: flex; align-items: center">
<div style="cursor: pointer" @click="sortHandler('fromuptime')">
<span>按时间排序</span> <span>按时间排序</span>
<SvgIcon style="margin-left: 8px;" name="sort" size="12" /> <SvgIcon style="margin-left: 8px" name="sort" size="12" />
</div> </div>
<div style="margin-left: 15px;cursor: pointer" @click="sortHandler('pictureResult')"> <div
style="margin-left: 15px; cursor: pointer"
@click="sortHandler('pictureResult')"
>
<span>相似度排序</span> <span>相似度排序</span>
<SvgIcon style="margin-left: 8px;" name="sort" size="12" /> <SvgIcon style="margin-left: 8px" name="sort" size="12" />
</div> </div>
</div> </div>
</div> </div>
<div class="wrapper-list"> <div class="wrapper-list">
<div <div
v-for="(item, index) in listData" :key="index" :class="{ 'item-selected': item === selectTask }" v-for="(item, index) in listData"
class="grid-item" @click="handleSelect(item)" @mouseover="overTaskHandelr(item)" :key="index"
:class="{ 'item-selected': item === selectTask }"
class="grid-item"
@click="handleSelect(item)"
@mouseover="overTaskHandelr(item)"
@mouseleave="leaveTaskHandler" @mouseleave="leaveTaskHandler"
> >
<div class="img-wrapper" :style="{ 'background-image': `url(${item.thumburl})` }" /> <div
class="img-wrapper"
:style="{ 'background-image': `url(${item.thumburl})` }"
/>
<div class="check"> <div class="check">
<n-checkbox <n-checkbox
v-show="batch" v-model:checked="item.checked" @click.stop v-show="batch"
v-model:checked="item.checked"
@click.stop
@update:checked="onCheckChange($event, item)" @update:checked="onCheckChange($event, item)"
/> />
</div> </div>
@ -541,8 +600,8 @@ function previewHandler(event: MouseEvent) {
<SvgIcon v-show="item.iztrueorfalse === 1" name="zhen" /> <SvgIcon v-show="item.iztrueorfalse === 1" name="zhen" />
</div> </div>
<div v-show="overTask && overTask.id === item.id" class="action"> <div v-show="overTask && overTask.id === item.id" class="action">
<SvgIcon style="cursor: pointer;" name="t1" @click.stop="trueHandler" /> <SvgIcon style="cursor: pointer" name="t1" @click.stop="trueHandler" />
<SvgIcon style="cursor: pointer;" name="t2" @click.stop="falseHandler" /> <SvgIcon style="cursor: pointer" name="t2" @click.stop="falseHandler" />
</div> </div>
</div> </div>
</div> </div>
@ -560,7 +619,7 @@ function previewHandler(event: MouseEvent) {
box-sizing: border-box; box-sizing: border-box;
margin-left: 16px; margin-left: 16px;
padding: 16px 16px 0px 16px; padding: 16px 16px 0px 16px;
background: #FFF; background: #fff;
border-radius: 3px; border-radius: 3px;
border: 1px solid rgb(239, 239, 245); border: 1px solid rgb(239, 239, 245);
@ -573,7 +632,7 @@ function previewHandler(event: MouseEvent) {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
background: #FFF; background: #fff;
box-sizing: border-box; box-sizing: border-box;
border-radius: 3px; border-radius: 3px;
margin-bottom: 16px; margin-bottom: 16px;
@ -604,11 +663,11 @@ function previewHandler(event: MouseEvent) {
height: 36px; height: 36px;
background: linear-gradient(135deg, #5b85f8, #3c6cf0); background: linear-gradient(135deg, #5b85f8, #3c6cf0);
border-radius: 17px; border-radius: 17px;
box-shadow: 0px 2px 6px 0px rgba(116, 153, 253, 0.30); box-shadow: 0px 2px 6px 0px rgba(116, 153, 253, 0.3);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
color: #FFF; color: #fff;
cursor: pointer; cursor: pointer;
} }
@ -629,7 +688,7 @@ function previewHandler(event: MouseEvent) {
&-detail { &-detail {
display: flex; display: flex;
height: calc((100vh - 88px - 72px)/2); height: calc((100vh - 88px - 72px) / 2);
.left { .left {
flex: 1; flex: 1;
@ -728,8 +787,8 @@ function previewHandler(event: MouseEvent) {
} }
.tag-actived { .tag-actived {
color: #FE9800; color: #fe9800;
border: 1px solid #FE9800; border: 1px solid #fe9800;
} }
.property { .property {
@ -749,7 +808,7 @@ function previewHandler(event: MouseEvent) {
position: absolute; position: absolute;
left: 72px; left: 72px;
top: 4px; top: 4px;
content: ''; content: "";
width: 1px; width: 1px;
height: 12px; height: 12px;
background: #979797; background: #979797;
@ -772,7 +831,7 @@ function previewHandler(event: MouseEvent) {
.item-selected { .item-selected {
box-shadow: 0px 2px 8px 0px rgba(0, 65, 207, 0.28); box-shadow: 0px 2px 8px 0px rgba(0, 65, 207, 0.28);
background-color: #FFF; background-color: #fff;
} }
.grid-item { .grid-item {
@ -804,7 +863,7 @@ function previewHandler(event: MouseEvent) {
z-index: 3; z-index: 3;
right: 12px; right: 12px;
top: 2px; top: 2px;
color: #FFF; color: #fff;
.val { .val {
position: absolute; position: absolute;
@ -816,6 +875,12 @@ function previewHandler(event: MouseEvent) {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 12px;
font-family: PingFang SC, PingFang SC-Semibold;
font-weight: Semibold;
text-align: left;
color: #ffffff;
line-height: 24px;
} }
} }
@ -856,4 +921,14 @@ function previewHandler(event: MouseEvent) {
margin-top: 12px; margin-top: 12px;
margin-bottom: 12px; margin-bottom: 12px;
} }
.time {
position: absolute;
z-index: 3;
left: 2%;
bottom: 2%;
color: #fff;
display: flex;
align-items: center;
}
</style> </style>

@ -66,7 +66,7 @@ onBeforeMount(async () => {
</div> </div>
<div class="wrapper-content"> <div class="wrapper-content">
<span>判假原因</span> <span>判假原因</span>
<n-select v-model:value="selectId" style="margin-top: 10px;" :options="options" /> <n-select filterable v-model:value="selectId" style="margin-top: 10px;" :options="options" />
<n-input v-show="showOther" v-model:value="otherValue" style="margin-top: 10px;" type="textarea" /> <n-input v-show="showOther" v-model:value="otherValue" style="margin-top: 10px;" type="textarea" />
</div> </div>
</div> </div>

Loading…
Cancel
Save