Compare commits

...

11 Commits

@ -90,17 +90,20 @@ const getThemeOverrides = computed(() => {
// transform: rotate(-90deg) !important; // transform: rotate(-90deg) !important;
// } // }
.n-scrollbar-content { .n-scrollbar-content {
padding: 0 7.97px 0 4px; padding: 0 7.97px 16 16px;
} }
.n-form-item .n-form-item-label { .n-form-item .n-form-item-label {
font-size: 14px !important; font-size: 14px !important;
color: #333333 !important; color: #333333 !important;
} }
.n-slider-dots > .n-slider-dot:nth-child(2) { .n-slider-dots > .n-slider-dot {
display: none !important; display: none !important;
} }
.n-collapse-item-arrow i svg { .n-collapse-item-arrow i svg {
width: 14px !important; width: 14px !important;
height: 14px !important; height: 14px !important;
} }
.v-binder-follower-content {
left: -60px;
}
</style> </style>

@ -28,7 +28,7 @@ export async function getApprovalList(page: any) {
/** /**
* *
* @param param * @param params
*/ */
export async function audit(params) { export async function audit(params) {
return http.request({ return http.request({
@ -82,8 +82,6 @@ export async function removeFiles(params) {
/** /**
* () * ()
* @param packageid id
* @param taskchildpictureid id
* @param params * @param params
* @returns * @returns
*/ */

@ -1,29 +1,68 @@
<script lang="ts" setup> <script lang="ts" setup>
import { defineProps, onMounted, ref } from 'vue' import { defineProps, onMounted, ref } from "vue";
import { gettaskToolsCount } from '@/api/home/main' import { gettaskToolsCount } from "@/api/home/main";
defineProps({ defineProps({
hasColor: { hasColor: {
type: Boolean, type: Boolean,
default: () => false, default: () => false,
}, },
}) });
const data = ref() const data = ref([
{
link: "count",
title: "任务总数",
count: 0,
},
{
link: "wait",
title: "待审批",
count: 0,
},
{
link: "done",
title: "已审批",
count: 0,
},
{
link: "resolve",
title: "通过",
count: 0,
color: "#03c984",
},
{
link: "reject",
title: "不通过",
count: 0,
color: "#ff8b8b",
},
{
link: "reimg",
title: "图片重复数",
count: 0,
},
{
link: "breakcount",
title: "小结重复数",
count: 0,
},
]);
function initRem() { function initRem() {
const designWidth = 1440 const designWidth = 1440;
const rempPx = 16 const rempPx = 16;
const scale = window.innerWidth / designWidth const scale = window.innerWidth / designWidth;
document.documentElement.style.fontSize = `${scale * rempPx}px` document.documentElement.style.fontSize = `${scale * rempPx}px`;
} }
onMounted(() => { onMounted(() => {
initRem() initRem();
getData() getData();
}) });
async function getData() { async function getData() {
const { const { data } = await gettaskToolsCount();
data: { if (data) {
const {
total, total,
treat, treat,
alreadyApprove, alreadyApprove,
@ -31,62 +70,72 @@ async function getData() {
repeat, repeat,
approvedCount, approvedCount,
notGoCount, notGoCount,
}, } = data;
} = await gettaskToolsCount() data.value = [
data.value = [ {
{ link: "count",
link: 'count', title: "任务总数",
title: '任务总数', count: total,
count: total, },
}, {
{ link: "wait",
link: 'wait', title: "待审批",
title: '待审批', count: treat,
count: treat, },
}, {
{ link: "done",
link: 'done', title: "已审批",
title: '已审批', count: alreadyApprove,
count: alreadyApprove, },
}, {
{ link: "resolve",
link: 'resolve', title: "通过",
title: '通过', count: approvedCount,
count: approvedCount, color: "#03c984",
color: '#03c984', },
}, {
{ link: "reject",
link: 'reject', title: "不通过",
title: '不通过', count: notGoCount,
count: notGoCount, color: "#ff8b8b",
color: '#ff8b8b', },
}, {
{ link: "reimg",
link: 'reimg', title: "图片重复数",
title: '图片重复数', count: repeat,
count: repeat, },
}, {
{ link: "breakcount",
link: 'breakcount', title: "小结重复数",
title: '小结重复数', count: repeatedNodules,
count: repeatedNodules, },
}, ];
] }
} }
</script> </script>
<template> <template>
<div class="header_wrap"> <div class="header_wrap" :style="hasColor ? '' : 'margin-top: 7.375rem;'">
<div v-for="(item, index) in data" :key="index" class="header_item"> <div v-for="(item, index) in data" :key="index" class="header_box">
<SvgIcon :name="item.link" /> <div class="header_item">
<div class="data_wrap"> <SvgIcon :name="item.link" :style="index == 0 ? 'margin-left:0.5rem' : ''" />
<div class="data_title" :style="hasColor ? `color:${item.color || ''}` : ''"> <div class="data_wrap">
{{ item.count }} <div class="data_title" :style="hasColor ? `color:${item.color || ''}` : ''">
</div> {{ item.count }}
<div class="data_content"> </div>
{{ item.title }} <div class="data_content">
{{ item.title }}
</div>
</div> </div>
</div> </div>
<div
class="line"
:style="
hasColor
? 'margin-left:2.5rem;margin-right:2.0625rem'
: 'margin-left:1.25rem;margin-right:0.8125rem'
"
/>
</div> </div>
<SvgIcon size="14px" style="cursor: pointer" name="setting" class="settingSvg" /> <SvgIcon size="14px" style="cursor: pointer" name="setting" class="settingSvg" />
</div> </div>
@ -99,41 +148,48 @@ async function getData() {
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
padding: 1rem 1rem 1rem 3.125rem; padding: 1rem 1rem 1rem 3.125rem;
background: #fff; background: #f5f7f9;
margin-bottom: 1rem; margin-bottom: 1rem;
// 180-62 header
.header_item { padding-left: 2.125rem;
min-width: 10%; .header_box {
display: flex; display: flex;
flex-flow: row nowrap; flex-flow: row nowrap;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
svg { min-width: 10%;
width: 2.75rem !important; .header_item {
height: 2.75rem !important; display: flex;
} flex-flow: row nowrap;
.data_wrap { align-items: center;
margin-left: 0.8125rem; justify-content: center;
.data_title { svg {
font-size: 1.125rem; width: 2.75rem !important;
font-family: HarmonyOS Sans SC, HarmonyOS Sans SC-Bold; height: 2.75rem !important;
font-weight: 900;
text-align: left;
color: #202020;
line-height: 1.4375rem;
text-align: center;
white-space: nowrap;
} }
.data_content { .data_wrap {
opacity: 0.6; margin-left: 0.75rem;
font-size: 0.75rem; .data_title {
font-family: PingFang SC, PingFang SC-Regular; font-size: 1.125rem;
font-weight: 500; font-family: HarmonyOS Sans SC, HarmonyOS Sans SC-Bold;
text-align: center; font-weight: 900;
color: #202020; text-align: left;
line-height: 1rem; color: #202020;
text-align: center; line-height: 1.4375rem;
white-space: nowrap; text-align: center;
white-space: nowrap;
}
.data_content {
opacity: 0.6;
font-size: 0.75rem;
font-family: PingFang SC, PingFang SC-Regular;
font-weight: 500;
text-align: center;
color: #202020;
line-height: 1rem;
text-align: center;
white-space: nowrap;
}
} }
} }
} }
@ -142,4 +198,9 @@ async function getData() {
width: 1rem !important; width: 1rem !important;
height: 1rem !important; height: 1rem !important;
} }
.line {
width: 0.0625rem;
height: 1.25rem;
background: #e8e8e8;
}
</style> </style>

@ -88,9 +88,9 @@ const saveHandler = debounce(() => {
.title { .title {
font-size: 18px; font-size: 18px;
font-family: PingFang SC, PingFang SC-Medium; font-family: PingFang SC, PingFang SC-Medium;
font-weight: Medium;
color: #333333; color: #333333;
margin-bottom: 24px; margin-bottom: 24px;
font-weight: 500;
} }
.ql-toolbar.ql-snow { .ql-toolbar.ql-snow {

@ -107,12 +107,19 @@ onMounted(() => {
<n-input <n-input
v-model:value="value" v-model:value="value"
placeholder="搜索任务ID、任务名称、提报人、拜访终端" placeholder="搜索任务ID、任务名称、提报人、拜访终端"
placeholder-style="width:304px;height:22px;margin:17px 0 17px 12px;"
style="font-size: 16px; font-weight: 500; color: #333333"
type="text" type="text"
@input="inputHandler" @input="inputHandler"
@mousedown="handlerShowList" @mousedown="handlerShowList"
> >
<template #prefix> <template #prefix>
<SvgIcon name="magnifying-1" size="18" /> <SvgIcon
name="magnifying-1"
width="21"
height="20"
style="margin: 10px 0 10px 4px"
/>
</template> </template>
</n-input> </n-input>
</div> </div>
@ -159,7 +166,7 @@ onMounted(() => {
class="list_item" class="list_item"
@click="goPath(item, sitem.id)" @click="goPath(item, sitem.id)"
> >
<SvgIcon name="task-icon" size="16" /> <SvgIcon name="task-icon" size="16" style="margin-left: 16px" />
<span class="name" v-html="highlightText(sitem.name, value)" /> <span class="name" v-html="highlightText(sitem.name, value)" />
</div> </div>
</div> </div>
@ -169,10 +176,11 @@ onMounted(() => {
<style lang="less" scoped> <style lang="less" scoped>
.input_wrap { .input_wrap {
width: 60%; // width: 60%;
width: 808px;
position: absolute; position: absolute;
top: 20%; top: 20%;
left: 20%; left: 30%;
box-shadow: none !important; box-shadow: none !important;
.ip_box { .ip_box {
@ -194,6 +202,8 @@ onMounted(() => {
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
box-shadow: 0px 12px 12px 0px rgba(80, 122, 253, 0.15), 0px 0px 0px 0.5px #d4e3fc; box-shadow: 0px 12px 12px 0px rgba(80, 122, 253, 0.15), 0px 0px 0px 0.5px #d4e3fc;
// width: 808px;
// height: 56px;
} }
.list_box { .list_box {
@ -203,22 +213,25 @@ onMounted(() => {
box-shadow: 0px 12px 12px 0px rgba(80, 122, 253, 0.15); box-shadow: 0px 12px 12px 0px rgba(80, 122, 253, 0.15);
margin-top: 15px; margin-top: 15px;
padding: 8px 16px; padding: 8px 16px;
width: 802px;
height: 400px;
.list_classfiy_item { .list_classfiy_item {
margin-bottom: -2px;
.list_title { .list_title {
font-size: 12px; font-size: 12px;
font-family: PingFang SC, PingFang SC-Regular; font-family: PingFang SC, PingFang SC-Regular;
font-weight: Regular; font-weight: Regular;
color: #999999; color: #999999;
line-height: 17px; line-height: 17px;
margin: 10px 0 10px 5px; margin: 6px 0 12px 0;
font-weight: 500;
} }
.list_item { .list_item {
display: flex; display: flex;
flex-flow: row nowrap; flex-flow: row nowrap;
align-items: center; align-items: center;
margin-bottom: 10px; margin: 16px 0;
} }
} }
} }
@ -230,12 +243,15 @@ onMounted(() => {
.history-list { .history-list {
align-items: center; align-items: center;
padding-bottom: 9px; // margin-bottom:12;12+26=38
padding: 26px 12px 12px 0;
} }
.name { .name {
margin-left: 5px; margin-left: 8px;
cursor: pointer; cursor: pointer;
font-weight: 500;
color: #333333;
} }
.tag-wrap { .tag-wrap {
@ -244,8 +260,10 @@ onMounted(() => {
flex: 1; flex: 1;
overflow-y: hidden; overflow-y: hidden;
overflow-x: auto; overflow-x: auto;
margin: 9px 0 9px 29px;
.tag { .tag {
font-weight: 500;
padding: 0 12px; padding: 0 12px;
height: 22px; height: 22px;
border: 1px solid #e4e7ed; border: 1px solid #e4e7ed;

@ -1,29 +1,33 @@
<script lang="ts" setup> <script lang="ts" setup>
import { defineOptions, ref } from 'vue' import { defineOptions, ref } from "vue";
import Quill from '@/components/RichEditor/Quill.vue' import Quill from "@/components/RichEditor/Quill.vue";
defineOptions({ name: 'FilterModal' }) defineOptions({ name: "FilterModal" });
const emit = defineEmits(['showNewFilter']) const emit = defineEmits(["showNewFilter"]);
const show = ref(false) const show = ref(false);
function showModal() { function showModal() {
show.value = true show.value = true;
} }
function closeModal() { function closeModal() {
show.value = false show.value = false;
} }
defineExpose({ defineExpose({
showModal, showModal,
}) });
</script> </script>
<template> <template>
<div> <div>
<n-modal v-model:show="show" transform-origin="center"> <n-modal
v-model:show="show"
transform-origin="center"
style="margin: calc(13%-147px) auto 0 !important"
>
<Quill @close="show = false" /> <Quill @close="show = false" />
</n-modal> </n-modal>
</div> </div>

@ -1,49 +1,71 @@
<script lang="ts" setup> <script lang="ts" setup>
import { defineOptions, ref } from 'vue' import { defineOptions, ref } from "vue";
defineOptions({ name: 'ShortcutModal' }) defineOptions({ name: "ShortcutModal" });
const show = ref(false) const show = ref(false);
const cardStyle = { const cardStyle = {
'width': '800px', "width": "800px",
'--n-padding-bottom': '10px', "--n-padding-bottom": "10px",
'--n-padding-left': '10px', "--n-padding-left": "10px",
'padding-bottom':'100px' "padding-bottom": "100px",
} };
function showModal() { function showModal() {
show.value = true show.value = true;
} }
function closeModal() { function closeModal() {
show.value = false show.value = false;
} }
defineExpose({ defineExpose({
showModal, showModal,
}) });
</script> </script>
<template> <template>
<div> <div>
<n-modal v-model:show="show" transform-origin="center"> <n-modal
<n-card :style="cardStyle" :bordered="false" size="huge" role="dialog" aria-modal="true"> v-model:show="show"
transform-origin="center"
style="width: 808px; height: 606px; margin: -27px auto 0 !important"
>
<n-card
:style="cardStyle"
:bordered="false"
size="huge"
role="dialog"
aria-modal="true"
>
<div class="wrapper"> <div class="wrapper">
<div class="wrapper-header"> <div class="wrapper-header">
<span class="wrapper-left">全局快捷键</span> <span class="wrapper-left">全局快捷键</span>
<div class="wrapper-right"> <div class="wrapper-right">
<img class="img-question" src="@/assets/images/question.png" alt="">查看快捷键的信息
<img
class="img-question"
src="@/assets/images/question.png"
alt=""
style="width: 18px; height: 18px"
>查看快捷键的信息
<img class="img-close" src="@/assets/images/close.png" alt="" @click="closeModal"> <img
class="img-close"
src="@/assets/images/close.png"
alt=""
style="width: 20px; height: 20px"
@click="closeModal"
>
</div> </div>
</div> </div>
<n-divider /> <n-divider style="margin-bottom: 32px" />
<div class="title"> <div class="title">
全局快捷方式 全局快捷方式
</div> </div>
<div class="wrapper-global"> <div class="wrapper-global">
<table style="margin-left: 100px;"> <table style="margin-left: 47px; width: 180px">
<tr> <tr>
<td><div class="key" data-key="g h" /></td> <td><div class="key" data-key="g h" /></td>
<td>进入一键查看主页</td> <td>进入一键查看主页</td>
@ -73,7 +95,7 @@ defineExpose({
<td>打开可疑文件夹</td> <td>打开可疑文件夹</td>
</tr> </tr>
</table> </table>
<table style="height: 30%;margin-left: 180px;"> <table style="height: 30%; margin-left: 180px">
<tr> <tr>
<td><div class="key" data-key="[" /></td> <td><div class="key" data-key="[" /></td>
<td>隐藏/显示当前场景左侧筛选区</td> <td>隐藏/显示当前场景左侧筛选区</td>
@ -96,29 +118,36 @@ defineExpose({
</tr> </tr>
</table> </table>
</div> </div>
<n-divider /> <n-divider style="margin: 24px 24px 32px 24px; color: #d9d9d9" />
<div class="title"> <div class="title" style="margin-top: -16.5px">
任务审批/任务终审/AI工单明细动作 任务审批/任务终审/AI工单明细动作
</div> </div>
<div class="wrapper-request"> <div class="wrapper-request">
<table style="margin-left: 100px;"> <table style="margin-left: 47px; width: 180px">
<tr> <tr>
<td><div class="key" data-key="p p" /></td> <td style="text-align: left; width: 53px">
<div class="key" data-key="p p" />
</td>
<td>通过</td> <td>通过</td>
</tr> </tr>
<tr> <tr>
<td><div class="key" data-key="x x" /></td> <td style="text-align: left">
<div class="key" data-key="x x" />
</td>
<td>不通过</td> <td>不通过</td>
</tr> </tr>
</table> </table>
<table style="margin-left: 155px;"> <table style="margin-left: 180px">
<tr> <tr>
<td><div class="key" data-key="c" /></td> <td><div class="key" data-key="c" /></td>
<td>关闭关闭当前场景弹窗</td> <td>关闭关闭当前场景弹窗</td>
</tr> </tr>
<tr> <tr>
<td><div class="key" data-key="&larr;" /><span>/</span><div class="key" data-key="&rarr;" /></td> <td>
<div class="key" data-key="&larr;" />
<span>/</span>
<div class="key" data-key="&rarr;" />
</td>
<td>打开上一条/下一条信息切换</td> <td>打开上一条/下一条信息切换</td>
</tr> </tr>
</table> </table>
@ -142,54 +171,56 @@ defineExpose({
</template> </template>
<style lang="less" scoped> <style lang="less" scoped>
.wrapper-footer{ .wrapper-footer {
margin-top: -20px; margin-top: -20px;
} }
.wrapper { .wrapper {
.wrapper-header {
.wrapper-header{ padding: 14px 0 14px 0;
padding: 14px;
padding-bottom: 0; padding-bottom: 0;
} }
.img-question{ .img-question {
width: 16px; width: 16px;
height: 16px; height: 16px;
margin: 0 2px; margin: 0 2px;
} }
.img-close{ .img-close {
width: 16px; width: 16px;
height: 16px; height: 16px;
margin-left: 16px; margin-left: 16px;
cursor: pointer; cursor: pointer;
} }
.wrapper-right{ .wrapper-right {
font-size: 16px; font-size: 16px;
font-family: PingFang SC, PingFang SC-Regular; font-family: PingFang SC, PingFang SC-Regular;
font-weight: Regular; font-weight: 400;
text-align: left; text-align: left;
color: #666666; color: #666666;
line-height: 22px; line-height: 22px;
display: flex; display: flex;
align-items: center align-items: center;
} }
.wrapper-left{ .wrapper-left {
font-size: 18px; font-size: 18px;
font-family: PingFang SC, PingFang SC-Medium; font-family: PingFang SC, PingFang SC-Medium;
font-weight: 600; font-weight: 600;
text-align: left; text-align: left;
color: #333333; color: #000000;
line-height: 25px; line-height: 25px;
} }
.title{ .title {
font-size: 14px; font-size: 14px;
font-weight: 600; font-weight: 600;
margin-bottom: 10px; margin-bottom: 10px;
padding-left: 30px; padding-left: 47px;
color: #333333;
font-weight: 600;
// 线24px
} }
&-header { &-header {
display: flex; display: flex;
@ -220,7 +251,7 @@ defineExpose({
} }
&-icon { &-icon {
background: #FFF; background: #fff;
display: inline-block; display: inline-block;
width: 18px; width: 18px;
height: 1px; height: 1px;
@ -228,32 +259,31 @@ defineExpose({
-webkit-transform: rotate(45deg); -webkit-transform: rotate(45deg);
&:after { &:after {
content: ''; content: "";
display: block; display: block;
width: 18px; width: 18px;
height: 1px; height: 1px;
background: #FFF; background: #fff;
transform: rotate(-90deg); transform: rotate(-90deg);
-webkit-transform: rotate(-90deg); -webkit-transform: rotate(-90deg);
} }
} }
} }
&-request,&-global{ &-request,
&-global {
display: flex; display: flex;
table{ table {
tr td:first-child{ tr td:first-child {
text-align: right; text-align: right;
padding-right: 10px; padding-right: 10px;
color: #515457; color: #515457;
} }
tr td{ tr td {
color: #333333; color: #333333;
} }
tr span{ tr span {
padding: 0 10px; padding: 0 10px;
} }
} }
@ -269,13 +299,14 @@ defineExpose({
display: inline-block; display: inline-block;
box-sizing: content-box; box-sizing: content-box;
font-size: 16px; font-size: 16px;
font-weight: bold;
text-align: center; text-align: center;
padding: 2px 6px; padding: 2px 6px;
border: 1px solid #d6d6d6; border: 1px solid #d6d6d6;
border-left: 3px solid #d6d6d6; border-left: 3px solid #d6d6d6;
border-bottom: 3px solid #d6d6d6; border-bottom: 3px solid #d6d6d6;
background-color: #fdfdfd; background-color: #fdfdfd;
// color: #333333;
font-weight: bold;
} }
.key[data-key]::after { .key[data-key]::after {

@ -1,92 +1,92 @@
<script lang="ts" setup> <script lang="ts" setup>
import { computed, inject, onMounted, ref } from 'vue' import { computed, inject, onMounted, ref } from "vue";
import { useRoute, useRouter } from 'vue-router' import { useRoute, useRouter } from "vue-router";
import { useUser } from '@/store/modules/user' import { useUser } from "@/store/modules/user";
import { getImgUrl } from '@/utils/urlUtils' import { getImgUrl } from "@/utils/urlUtils";
import defaultAvatar from '@/assets/icons/avatar.svg' import defaultAvatar from "@/assets/icons/avatar.svg";
const emit = defineEmits<{ const emit = defineEmits<{
(e: 'logout'): void (e: "logout"): void
}>() }>();
const router = useRouter() const router = useRouter();
const userStore = useUser() const userStore = useUser();
const useInfo = userStore.getUserInfo const useInfo = userStore.getUserInfo;
const aiDisabled = ref(false) const aiDisabled = ref(false);
function handleSelect(row) { function handleSelect(row) {
userStore.updateTenantId(row.key) userStore.updateTenantId(row.key);
location.reload() location.reload();
} }
function logIt(e) { function logIt(e) {
return false return false;
} }
// //
function goHome(e) { function goHome(e) {
router.push({ name: 'home' }) router.push({ name: "home" });
} }
// //
function goTask(e) { function goTask(e) {
router.push({ name: 'task-main' }) router.push({ name: "task-main" });
} }
// AI // AI
function goWorksheet(e) { function goWorksheet(e) {
router.push({ name: 'worksheet-main' }) router.push({ name: "worksheet-main" });
} }
// //
function goFinal(e) { function goFinal(e) {
router.push({ name: 'final-main' }) router.push({ name: "final-main" });
} }
const mousetrap = inject('mousetrap') as any const mousetrap = inject("mousetrap") as any;
onMounted(() => { onMounted(() => {
mousetrap.bind('g h', goHome) mousetrap.bind("g h", goHome);
mousetrap.bind('g t', goTask) mousetrap.bind("g t", goTask);
mousetrap.bind('g a', goWorksheet) mousetrap.bind("g a", goWorksheet);
mousetrap.bind('g e', goFinal) mousetrap.bind("g e", goFinal);
}) });
const showPopover = ref(false) const showPopover = ref(false);
const popRef = ref(null) const popRef = ref(null);
const changeFlag = ref(false) const changeFlag = ref(false);
const iconName = computed(() => { const iconName = computed(() => {
return showPopover.value ? 'expand' : 'collapse' return showPopover.value ? "expand" : "collapse";
}) });
function handleUpdateShow(show: boolean) { function handleUpdateShow(show: boolean) {
showPopover.value = show showPopover.value = show;
} }
function logOut() { function logOut() {
(popRef.value as any).setShow(false) (popRef.value as any).setShow(false);
emit('logout') emit("logout");
} }
const currentCompanyName = computed(() => { const currentCompanyName = computed(() => {
const deptlist = useInfo.deptlist const deptlist = useInfo.deptlist;
const currentId = userStore.getTenantId const currentId = userStore.getTenantId;
const current = deptlist.find(item => item.deptno === currentId) const current = deptlist.find(item => item.deptno === currentId);
return current?.departname || 'name' return current?.departname || "name";
}) });
const options = computed(() => { const options = computed(() => {
const deptlist = useInfo.deptlist const deptlist = useInfo.deptlist;
return deptlist.map((item) => { return deptlist.map((item) => {
return { return {
label: item.departname, label: item.departname,
key: item.deptno, key: item.deptno,
} };
}) });
}) });
</script> </script>
<template> <template>
@ -155,9 +155,11 @@ const options = computed(() => {
.header { .header {
.user-name { .user-name {
font-size: 16px; font-size: 16px;
font-weight: 600;
} }
.depart-name { .depart-name {
font-size: 12px; font-size: 12px;
font-weight: 600;
} }
} }
} }
@ -194,6 +196,8 @@ const options = computed(() => {
padding: 13px 20px; padding: 13px 20px;
cursor: pointer; cursor: pointer;
color: #333333; color: #333333;
font-size: 13px;
font-weight: 600;
} }
.trigger:hover { .trigger:hover {

@ -1,6 +1,15 @@
<script lang="ts"> <script lang="ts">
import { useDialog, useMessage } from 'naive-ui' import { useDialog, useMessage } from 'naive-ui'
import { defineComponent, inject, onMounted, reactive, ref, toRefs, unref, watch } from 'vue' import {
defineComponent,
inject,
onMounted,
reactive,
ref,
toRefs,
unref,
watch,
} from 'vue'
import { useRoute, useRouter } from 'vue-router' import { useRoute, useRouter } from 'vue-router'
import QuillModal from './QuillModal.vue' import QuillModal from './QuillModal.vue'
import RecycleModal from './RecycleModal.vue' import RecycleModal from './RecycleModal.vue'
@ -198,6 +207,7 @@ export default defineComponent({
<!-- 菜单收起 --> <!-- 菜单收起 -->
<div <div
class="ml-1 layout-header-trigger layout-header-trigger-min" class="ml-1 layout-header-trigger layout-header-trigger-min"
style="padding-left: 13px"
@click="() => $emit('update:collapsed', !collapsed)" @click="() => $emit('update:collapsed', !collapsed)"
> >
<SvgIcon name="homepage" size="16" /> <SvgIcon name="homepage" size="16" />
@ -227,7 +237,11 @@ export default defineComponent({
<!-- 个人中心 --> <!-- 个人中心 -->
<div class="layout-header-trigger layout-header-trigger-min"> <div class="layout-header-trigger layout-header-trigger-min">
<!-- <n-avatar :src="getImgUrl(useInfo.usericon)" round /> --> <!-- <n-avatar :src="getImgUrl(useInfo.usericon)" round /> -->
<n-avatar style="width:36px;height:36px;" :src="(useInfo.usericon && getImgUrl(useInfo.usericon)) || defaultAvatarSrc" round /> <n-avatar
style="width: 36px; height: 36px"
:src="(useInfo.usericon && getImgUrl(useInfo.usericon)) || defaultAvatarSrc"
round
/>
</div> </div>
<!-- 设置 --> <!-- 设置 -->
<UserSettings @logout="doLogout" /> <UserSettings @logout="doLogout" />

@ -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)
}) })

@ -5,7 +5,6 @@ import Content from './content/Content.vue'
import ListContent from './content/ListContent.vue' import ListContent from './content/ListContent.vue'
import Robot from '@/components/Robot/index.vue' import Robot from '@/components/Robot/index.vue'
defineOptions({ defineOptions({
name: 'FinalMain', name: 'FinalMain',
}) })
@ -13,9 +12,8 @@ const showList = ref(true)
const contentRef: any = ref(null) const contentRef: any = ref(null)
const ListRef: any = ref(null) const ListRef: any = ref(null)
function inputChange(keyword) { function inputChange(keyword) {
contentRef.value.filterTableData(keyword) contentRef.value.filterTableData(keyword)
ListRef.value.initData(keyword) ListRef.value.initData(keyword)
} }
</script> </script>

@ -336,7 +336,7 @@ defineExpose({
> >
<SvgIcon <SvgIcon
name="drag" name="drag"
size="18" size="13"
color="#333333" color="#333333"
style="margin-right: 3px" style="margin-right: 3px"
/> />
@ -344,20 +344,21 @@ defineExpose({
v-if="item.favorite && !item.isDefaultFilter" v-if="item.favorite && !item.isDefaultFilter"
name="favorite-fill" name="favorite-fill"
color="#fd9b0a" color="#fd9b0a"
width="13" size="18"
height="12"
style="margin-right: 3px" style="margin-right: 3px"
@click="unFavoriteHandler($event, item)" @click="unFavoriteHandler($event, item)"
/> />
<SvgIcon <SvgIcon
v-else-if="!item.favorite && !item.isDefaultFilter" v-else-if="!item.favorite && !item.isDefaultFilter"
name="favorite-unfill" name="favorite-unfill"
width="13" size="18"
height="12"
style="margin-right: 3px" style="margin-right: 3px"
@click="favoriteHandler($event, item)" @click="favoriteHandler($event, item)"
/> />
<div style="color: #333333" v-html="item.name" /> <div
style="color: #333333; white-space: nowrap; overflow: hidden"
v-html="item.name"
/>
</li> </li>
<!-- filter=".draggable-li[draggable='false']" --> <!-- filter=".draggable-li[draggable='false']" -->
<VueDraggable <VueDraggable
@ -375,13 +376,12 @@ defineExpose({
:draggable="true" :draggable="true"
@click="selectHandler(item)" @click="selectHandler(item)"
> >
<SvgIcon name="drag" size="10" style="margin-right: 3px" /> <SvgIcon name="drag" size="13" style="margin-right: 3px" />
<SvgIcon <SvgIcon
v-if="item.favorite && !item.isDefaultFilter" v-if="item.favorite && !item.isDefaultFilter"
name="favorite-fill" name="favorite-fill"
color="#fd9b0a" color="#fd9b0a"
width="13" size="18"
height="12"
fill="#666666" fill="#666666"
style="cursor: pointer !important; margin-right: 3px" style="cursor: pointer !important; margin-right: 3px"
@click="unFavoriteHandler($event, item)" @click="unFavoriteHandler($event, item)"
@ -389,13 +389,15 @@ defineExpose({
<SvgIcon <SvgIcon
v-else-if="!item.favorite && !item.isDefaultFilter" v-else-if="!item.favorite && !item.isDefaultFilter"
name="favorite-unfill" name="favorite-unfill"
width="13" size="18"
height="12"
fill="#666666" fill="#666666"
style="cursor: pointer !important; margin-right: 3px" style="cursor: pointer !important; margin-right: 3px"
@click="favoriteHandler($event, item)" @click="favoriteHandler($event, item)"
/> />
<div style="color: #333333" v-html="item.name" /> <div
style="color: #333333; white-space: nowrap; overflow: hidden"
v-html="item.name"
/>
</li> </li>
</VueDraggable> </VueDraggable>
</ul> </ul>
@ -426,13 +428,12 @@ defineExpose({
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
position: absolute; position: absolute;
left: 0;
top: -10px;
width: 100%; width: 100%;
padding: 17px 16px; padding: 17px 16px;
border-bottom: 1px solid #e8e8e8; border-bottom: 1px solid #e8e8e8;
z-index: 10; z-index: 10;
background: #ffffff; background: #ffffff;
left: 0;
&-left { &-left {
display: flex; display: flex;
@ -491,6 +492,12 @@ defineExpose({
.wrapper-left-popover { .wrapper-left-popover {
width: 248px; width: 248px;
height: 288px; height: 288px;
position: absolute;
left: 0;
top: -10px;
border: 1px solid #f3f8ff;
z-index: 10000;
background: #fff;
} }
::v-deep(.wrapper-left-popover .n-form-item) { ::v-deep(.wrapper-left-popover .n-form-item) {
display: block !important; display: block !important;

@ -14,34 +14,31 @@ import type { DataTableColumns, DataTableRowKey } from 'naive-ui'
import type { SortableEvent } from 'sortablejs' import type { SortableEvent } from 'sortablejs'
import Sortable from 'sortablejs' import Sortable from 'sortablejs'
import { debounce } from 'lodash-es' import { debounce } from 'lodash-es'
import selection from 'naive-ui/es/_internal/selection'
import Action from '../Action.vue' import Action from '../Action.vue'
import { deleteCondition, getConditionList, sort } from '@/api/home/filter' import { deleteCondition, getConditionList, sort } from '@/api/home/filter'
import type { FilterSearchParam } from '/#/api' import type { FilterSearchParam } from '/#/api'
import SvgIcon from '@/components/Icon/SvgIcon.vue' import SvgIcon from '@/components/Icon/SvgIcon.vue'
defineOptions({ name: 'FilterModal' }) defineOptions({ name: 'FilterModal' })
const props = defineProps({ const props = defineProps({
type: { type: {
type: Number, type: Number,
default: () => 0, default: () => 0,
}, },
}) })
const emit = defineEmits<{ const emit = defineEmits<{
(e: 'showNewFilter'): void (e: 'showNewFilter'): void
(e: 'editFilter', filter: any): void (e: 'editFilter', filter: any): void
(e: 'handleOk', item: any): void (e: 'handleOk', item: any): void
}>() }>()
const modal = useModal() const modal = useModal()
const tableData = ref<Array<RowData>>([])
const keyword = ref('')
const show = ref(false)
const $message = window.$message const $message = window.$message
const show = ref(false)
const tableData = ref<Array<RowData>>([])
const keyword = ref('')
const cardStyle = { const cardStyle = {
'width': '808px', 'width': '808px',
'height': '840px', 'height': '840px',
@ -124,7 +121,7 @@ const columns: DataTableColumns<RowData> = [
sorter: (row1, row2) => { sorter: (row1, row2) => {
// tableData.value.sort( // tableData.value.sort(
// (a, b) => new Date(a?.createtime).getTime() - new Date(b?.createtime).getTime() // (a, b) => new Date(a?.createtime).getTime() - new Date(b?.createtime).getTime()
// ); // )
return new Date(row1?.createtime).getTime() - new Date(row2?.createtime).getTime() return new Date(row1?.createtime).getTime() - new Date(row2?.createtime).getTime()
}, },
}, },
@ -205,32 +202,44 @@ 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 else {
case 2: const modalInst = modal.create({
deleteSelection(id) title: '确认提示',
// const modalInst = modal.create({ content: '确认删除该条过滤条件吗?',
// title: "", positiveText: '确定',
// content: "?", negativeText: '取消',
// positiveText: "", preset: 'dialog',
// negativeText: "", onPositiveClick: () => deleteSelection(id),
// preset: "dialog", onNegativeClick: () => modalInst.destroy(),
// onPositiveClick: () => deleteSelection(id), })
// 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) {
// const $message = window["$message"]; // const $message = window['$message']
// if (selectionIds.value.length === 0 || selectionIds.value.length > 1) { // if (selectionIds.value.length === 0 || selectionIds.value.length > 1) {
// $message.error(""); // $message.error('')
// return; // return
// } // }
const selectedId = id const selectedId = id
const selectedFilter = tableData.value.find((item: any) => { const selectedFilter = tableData.value.find((item: any) => {
@ -242,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)
}) })
@ -488,8 +497,9 @@ function handleOk() {
padding: 14px; padding: 14px;
&-title { &-title {
font-weight: bold; font-weight: 600;
font-size: 20px; color: #333333;
font-size: 18px;
height: 24px; height: 24px;
} }
@ -527,7 +537,8 @@ function handleOk() {
} }
&-table { &-table {
margin-top: 17px; //17-> 34-24/2+x
margin-top: 12px;
} }
&-footer { &-footer {
@ -543,8 +554,9 @@ function handleOk() {
&:before { &:before {
background-color: #1980ff; background-color: #1980ff;
content: ""; content: "";
width: 5px; width: 4px;
border-radius: 2px; height: 18px;
border-radius: 3px;
top: 0; top: 0;
left: 3px; left: 3px;
bottom: 0; bottom: 0;
@ -561,7 +573,6 @@ function handleOk() {
} }
} }
.del_btn { .del_btn {
margin-left: 12px;
color: #333333; color: #333333;
font-weight: 500; font-weight: 500;
} }
@ -586,9 +597,7 @@ function handleOk() {
font-size: 14px !important; font-size: 14px !important;
color: #000000 !important; color: #000000 !important;
} }
::v-deep(.n-data-table ::v-deep(.n-data-table .n-data-table-td) {
.n-data-table-tr:not(.n-data-table-tr--summary):hover
> .n-data-table-td) {
color: #666666 !important; color: #666666 !important;
font-size: 14px !important; font-size: 14px !important;
} }
@ -596,8 +605,6 @@ function handleOk() {
position: relative; position: relative;
left: -80px; left: -80px;
} }
.modal_wrapper {
}
::v-deep(.n-input .n-input__input-el) { ::v-deep(.n-input .n-input__input-el) {
height: 24px; height: 24px;
} }

@ -337,9 +337,9 @@ defineExpose({
<!-- j --> <!-- j -->
<n-input <n-input
v-model:value="formValue.name" v-model:value="formValue.name"
:style="{ width: '780px' }" :style="{ width: '760px', height: '36px' }"
maxlength="15" maxlength="15"
placeholder="请输入过滤名称" placeholder="请输入过滤条件名称"
@keydown.enter.prevent @keydown.enter.prevent
/> />
</n-form-item> </n-form-item>
@ -522,6 +522,7 @@ defineExpose({
font-weight: bold; font-weight: bold;
position: relative; position: relative;
background: #f8f8f8; background: #f8f8f8;
height: 24px;
&:before { &:before {
background-color: #1980ff; background-color: #1980ff;
@ -555,4 +556,8 @@ defineExpose({
color: #666666; color: #666666;
font-weight: 500; font-weight: 500;
} }
::v-deep(.n-form-item .n-form-item-feedback-wrapper .n-form-item-feedback) {
height: 24px;
line-height: 24px;
}
</style> </style>

@ -27,6 +27,9 @@ 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 defaultAvatar from '@/assets/icons/avatar.svg'
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'
@ -44,11 +47,12 @@ import {
queryPageListByCheckNo, queryPageListByCheckNo,
removeCheckDuplicate, removeCheckDuplicate,
} from '@/api/home/main' } from '@/api/home/main'
import type { PictureSortParam } from '/#/api'
import defaultAvatar from '@/assets/icons/avatar.svg'
import baseImg from '@/assets/images/baseImg.png'
import bgLoading from '@/assets/images/bg-loading.png' import bgLoading from '@/assets/images/bg-loading.png'
const listData = ref<any[]>([])
const timer = ref()
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
@ -165,13 +169,11 @@ 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')
}) })
const listData = ref<any[]>([])
watch( watch(
() => searchValue.value, () => searchValue.value,
async (newVal, oldVal) => { async (newVal, oldVal) => {
@ -181,7 +183,7 @@ watch(
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
@ -293,8 +295,6 @@ const gridHeight = computed(() => {
return height return height
}) })
const timer = ref()
async function oneCheck() { async function oneCheck() {
const asideVal = cloneDeep(configStore.getAsideValue) const asideVal = cloneDeep(configStore.getAsideValue)
asideVal.upUserName = searchValue.value asideVal.upUserName = searchValue.value
@ -580,7 +580,10 @@ function refresh(val?: any) {
}) })
} }
} }
function cancel(val) { /**
* 取消查重任务
*/
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') {
@ -618,11 +621,6 @@ const dropdownOptions = ref([
}, },
]) ])
function loadImgOver(item) {
console.log('loadImgOver', item)
setTimeout(() => (item.loadOver = true), 2000)
}
defineExpose({ defineExpose({
showLoginSuccessModal, showLoginSuccessModal,
}) })
@ -672,7 +670,7 @@ defineExpose({
<div class="dropdown"> <div class="dropdown">
<!-- <span>{{ viewLabel || '请选择' }}</span> --> <!-- <span>{{ viewLabel || '请选择' }}</span> -->
<span>视图</span> <span>视图</span>
<SvgIcon class="gap" name="arrow-botton" size="14" /> <SvgIcon class="gap" name="arrow-botton" size="16" />
</div> </div>
</n-popselect> </n-popselect>
<div <div
@ -680,19 +678,20 @@ defineExpose({
@click="sortHandler('fromuptime')" @click="sortHandler('fromuptime')"
> >
<span>时间排序</span> <span>时间排序</span>
<SvgIcon style="margin-left: 8px" name="sort" size="12" /> <SvgIcon style="margin-left: 8px" name="sort" size="16" />
</div> </div>
<div <div
style="margin-left: 15px; cursor: pointer; color: #323233" style="margin-left: 15px; cursor: pointer; color: #323233"
@click="sortHandler('pictureResult')" @click="sortHandler('pictureResult')"
> >
<span>相似度排序</span> <span>相似度排序</span>
<SvgIcon style="margin-left: 8px" name="sort" size="12" /> <SvgIcon style="margin-left: 8px" name="sort" size="16" />
</div> </div>
</div> </div>
<span style="font-size: 16px; color: #333"> <span style="font-size: 16px; color: #333">
<span style="color: #507afd; font-weight: 500">{{ totalCount }}</span> </span> <span style="color: #507afd; font-weight: 500">{{ totalCount }}</span> </span>
</div> </div>
<n-spin :show="loading"> <n-spin :show="loading">
<div ref="el" class="scroll" :style="listStyle"> <div ref="el" class="scroll" :style="listStyle">
<!-- <n-scrollbar :on-scroll="scrollHandler"> --> <!-- <n-scrollbar :on-scroll="scrollHandler"> -->
@ -708,10 +707,16 @@ defineExpose({
class="wrapper-content-item-img" :class="{ 'wrapper-content-item-img-fit': viewMode !== 'masonry' }" class="wrapper-content-item-img" :class="{ 'wrapper-content-item-img-fit': viewMode !== 'masonry' }"
:src="item.imgUrl" :src="item.imgUrl"
> --> > -->
<n-image <n-image
ref="imageRef" ref="imageRef"
class="img" class="img"
:img-props="{ onClick: hideDownload }" :img-props="{
onClick: ($event) => {
hideDownload($event);
showClose = true;
},
}"
:class="{ :class="{
'img-fit': viewMode === 'horizontalVersion', 'img-fit': viewMode === 'horizontalVersion',
'img-full': viewMode === '3:4' || viewMode === 'verticalVersion', 'img-full': viewMode === '3:4' || viewMode === 'verticalVersion',
@ -765,7 +770,9 @@ defineExpose({
<template #trigger> <template #trigger>
<span>{{ item.imgName }}</span> <span>{{ item.imgName }}</span>
</template> </template>
{{ item.imgName }} <span
style="font-size: 12px; margin-top: 4px; margin-bottom: 16px"
>{{ item.imgName }}</span>
</n-tooltip> </n-tooltip>
</div> </div>
<div <div
@ -812,6 +819,9 @@ defineExpose({
<LoginSuccessModal ref="LoginSuccessModalRef" /> <LoginSuccessModal ref="LoginSuccessModalRef" />
<FinishPackageModal :id="packageIdRef" ref="finishPackageModal" /> <FinishPackageModal :id="packageIdRef" ref="finishPackageModal" />
<CheckingTaskModal ref="checkingTaskModalRef" @refresh="refresh" @cancel="cancel" /> <CheckingTaskModal ref="checkingTaskModalRef" @refresh="refresh" @cancel="cancel" />
<!-- <div class="close_box" v-show="showClose" @click="showClose = false">
<SvgIcon size="24" name="close-none-border" />
</div> -->
</div> </div>
</template> </template>
@ -934,6 +944,7 @@ defineExpose({
overflow: hidden; overflow: hidden;
position: relative; position: relative;
transition: 0.5s; transition: 0.5s;
margin: 0 6px 10px 6px;
.tag-status { .tag-status {
width: 46px; width: 46px;
@ -968,7 +979,9 @@ defineExpose({
border-radius: 7px; border-radius: 7px;
.img-name { .img-name {
width: 70%; // width: 70%;
width: 15px;
height: 15px;
color: #fff; color: #fff;
/* 设置文本溢出时的样式为省略号 */ /* 设置文本溢出时的样式为省略号 */
text-overflow: ellipsis; text-overflow: ellipsis;
@ -1082,4 +1095,10 @@ defineExpose({
text-align: center; text-align: center;
} }
} }
.close_box {
position: absolute;
right: 10%;
top: 20%;
z-index: 10000000000000000000;
}
</style> </style>

@ -1,7 +1,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { FormInst, FormRules } from 'naive-ui'; import type { FormInst, FormRules } from 'naive-ui'
import { useMessage } from 'naive-ui'; import { useMessage } from 'naive-ui'
import { ref } from 'vue'; import { ref } from 'vue'
const emit = defineEmits<{ const emit = defineEmits<{
(e: 'commit', value: any) (e: 'commit', value: any)
@ -72,18 +72,38 @@ function afterLeave() {
<template> <template>
<n-modal v-model:show="show" transform-origin="center" @after-leave="afterLeave"> <n-modal v-model:show="show" transform-origin="center" @after-leave="afterLeave">
<n-card :style="cardStyle" :bordered="false" size="huge" role="dialog" aria-modal="true"> <n-card
:style="cardStyle"
:bordered="false"
size="huge"
role="dialog"
aria-modal="true"
>
<div class="wrapper"> <div class="wrapper">
<span class="wrapper-title">生成任务包设置</span> <span class="wrapper-title">生成任务包设置</span>
<div class="wrapper-bar"> <div class="wrapper-bar">
<div class="wrapper-info"> <div class="wrapper-info">
<span :style="{ 'margin-left': '18px', 'font-size': '16px','font-weight':'600' }">基本信息</span> <span
:style="{
'margin-left': '18px',
'font-size': '16px',
'font-weight': '600',
}"
>基本信息</span>
</div> </div>
</div> </div>
<!-- require-mark-placement="left" --> <!-- require-mark-placement="left" -->
<n-form ref="formRef" :model="model" style="margin-top: 8px;" :rules="rules"> <n-form ref="formRef" :model="model" style="margin-top: 8px" :rules="rules">
<n-form-item class="wrapper-task-package-name" path="packagename" label="任务包名称"> <n-form-item
<n-input v-model:value="model.packagename" maxlength="12" @keydown.enter.prevent /> class="wrapper-task-package-name"
path="packagename"
label="任务包名称"
>
<n-input
v-model:value="model.packagename"
maxlength="12"
@keydown.enter.prevent
/>
</n-form-item> </n-form-item>
<!-- <n-form-item path="mark" :style="formItemStyle"> <!-- <n-form-item path="mark" :style="formItemStyle">
<n-checkbox v-model:checked="model.mark" > <n-checkbox v-model:checked="model.mark" >
@ -94,10 +114,23 @@ function afterLeave() {
</div> </div>
<template #footer> <template #footer>
<div class="wrapper-footer"> <div class="wrapper-footer">
<n-button style="background-color: #507AFD !important;" type="info" @click="handleSumbit"> <n-button
style="background-color: #507afd !important"
type="info"
@click="handleSumbit"
>
生成任务包 生成任务包
</n-button> </n-button>
<n-button secondary style="margin-left:15px;color: #333;background-color: #fff;border: 1px solid #CAD2DD;" @click="closeModal"> <n-button
secondary
style="
margin-left: 15px;
color: #333;
background-color: #fff;
border: 1px solid #cad2dd;
"
@click="closeModal"
>
取消 取消
</n-button> </n-button>
</div> </div>
@ -110,7 +143,7 @@ function afterLeave() {
.wrapper { .wrapper {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 14px 14px 0 14px ; padding: 14px 14px 0 14px;
&-title { &-title {
font-weight: 600; font-weight: 600;
// font-weight: bold; // font-weight: bold;
@ -123,7 +156,8 @@ function afterLeave() {
width: 100%; width: 100%;
margin-top: 24px; margin-top: 24px;
font-size: 16px; font-size: 16px;
margin-bottom: 16px; // margin-top:8px;
margin-bottom: 8px;
span { span {
color: #333; color: #333;
} }
@ -139,7 +173,8 @@ function afterLeave() {
::v-deep(.n-form-item-label) { ::v-deep(.n-form-item-label) {
color: #666; color: #666;
font-weight: 500; font-weight: 500;
margin-bottom: 8px; // labelpadding-bottom 2px 8-2
margin-bottom: 6px;
} }
} }
@ -162,8 +197,8 @@ function afterLeave() {
&-footer { &-footer {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
padding-bottom:6px ; padding-bottom: 6px;
button{ button {
font-size: 14px !important; font-size: 14px !important;
font-weight: 500 !important; font-weight: 500 !important;
} }
@ -174,7 +209,7 @@ function afterLeave() {
position: relative; position: relative;
&:before { &:before {
background-color: #1980FF; background-color: #1980ff;
content: ""; content: "";
width: 5px; width: 5px;
border-radius: 2px; border-radius: 2px;
@ -185,7 +220,6 @@ function afterLeave() {
} }
} }
::v-deep(.n-button--info-type){ ::v-deep(.n-button--info-type) {
} }
</style> </style>

@ -1,50 +1,50 @@
<script lang="ts" setup> <script lang="ts" setup>
import { ref } from "vue"; import { ref } from 'vue'
import { useConfig } from "@/store/modules/asideConfig"; import { useConfig } from '@/store/modules/asideConfig'
const emit = defineEmits<{ const emit = defineEmits<{
(e: "closeCallback", value: any); (e: 'closeCallback', value: any)
}>(); }>()
const show = ref(false); const show = ref(false)
const stys = { const stys = {
width: "424px", 'width': '424px',
height: "232px", 'height': '232px',
"--n-padding-bottom": "20px", '--n-padding-bottom': '20px',
"--n-padding-left": "0px", '--n-padding-left': '0px',
background: 'background':
"linear-gradient(132deg, rgba(255, 255, 255, 0.32) 21%, rgba(152, 172, 255, 0.14) 100%)", 'linear-gradient(132deg, rgba(255, 255, 255, 0.32) 21%, rgba(152, 172, 255, 0.14) 100%)',
"border-radius": "4px", 'border-radius': '4px',
"box-shadow": "0px 12px 48px 16px rgba(0, 0, 0, 0.03)", 'box-shadow': '0px 12px 48px 16px rgba(0, 0, 0, 0.03)',
"backdrop-filter": " blur(10px)", 'backdrop-filter': ' blur(10px)',
}; }
function showModal() { function showModal() {
show.value = true; show.value = true
} }
function closeModal() { function closeModal() {
show.value = false; show.value = false
emit("closeCallback", true); emit('closeCallback', true)
} }
function closeOnlyModal() { function closeOnlyModal() {
show.value = false; show.value = false
} }
defineExpose({ defineExpose({
showModal, showModal,
closeModal, closeModal,
closeOnlyModal, closeOnlyModal,
}); })
const configStore = useConfig(); const configStore = useConfig()
const percent = ref(0); const percent = ref(0)
configStore.$subscribe(() => { configStore.$subscribe(() => {
percent.value = configStore.getTimeNum; percent.value = configStore.getTimeNum
}); })
</script> </script>
<template> <template>
@ -58,13 +58,13 @@ configStore.$subscribe(() => {
<svg-icon <svg-icon
size="15" size="15"
name="close" name="close"
@click="closeModal"
style="position: absolute; right: 15.7px; top: 6px; cursor: pointer" style="position: absolute; right: 15.7px; top: 6px; cursor: pointer"
@click="closeModal"
/> />
<div class="wrapper"> <div class="wrapper">
<svg-icon size="90" name="robot2" /> <svg-icon size="90" name="robot2" />
<span style="margin-top: 24px">正在查重中</span>
</div> </div>
<span class="span_box">正在查重中</span>
<div style="padding: 0 20px"> <div style="padding: 0 20px">
<n-progress type="line" :percentage="percent" :show-indicator="false" /> <n-progress type="line" :percentage="percent" :show-indicator="false" />
</div> </div>
@ -74,10 +74,22 @@ configStore.$subscribe(() => {
<style lang="less" scoped> <style lang="less" scoped>
.wrapper { .wrapper {
width: 100%;
height: 95px;
display: flex; display: flex;
height: 100%;
flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.span_box {
display: flex;
justify-content: center;
}
.n-modal {
// 360*157 20px
width: 360px !important;
height: 157px !important;
}
.n-modal > .n-card > .n-card__content:first-child {
--n-padding-top: 16px !important;
}
</style> </style>

@ -1,101 +1,101 @@
<script lang="ts" setup> <script lang="ts" setup>
import { useInfiniteScroll } from '@vueuse/core' import { useInfiniteScroll } from "@vueuse/core";
import { defineProps, onMounted, onUnmounted, reactive, ref, watch } from 'vue' import { defineProps, onMounted, onUnmounted, reactive, ref, watch } from "vue";
import ListItem from './ListItem.vue' import ListItem from "./ListItem.vue";
import emitter from '@/utils/mitt' import emitter from "@/utils/mitt";
import { useTaskStore } from '@/store/modules/task' import { useTaskStore } from "@/store/modules/task";
defineProps({ defineProps({
showFieldList: { showFieldList: {
type: Array, type: Array,
default: () => [], default: () => [],
}, },
}) });
const taskStore = useTaskStore() const taskStore = useTaskStore();
const data = ref<any[]>([]) const data = ref<any[]>([]);
const activeId = ref('') const activeId = ref("");
const el = ref<HTMLDivElement | null>(null) const el = ref<HTMLDivElement | null>(null);
const keyword = ref('') const keyword = ref("");
const canloadMore = ref(true) const canloadMore = ref(true);
const isLoading = ref(false) const isLoading = ref(false);
const searchId = ref('') const searchId = ref("");
const pagination = reactive({ const pagination = reactive({
pageNo: 0, pageNo: 0,
pageSize: 30, pageSize: 30,
}) });
function selectHandler(item, index: number) { function selectHandler(item, index: number) {
activeId.value = item.id activeId.value = item.id;
console.log(activeId.value, item.id) console.log(activeId.value, item.id);
console.log(index) console.log(index);
taskStore.setActive(index, item.id) taskStore.setActive(index, item.id);
} }
useInfiniteScroll( useInfiniteScroll(
el as any, el as any,
() => { () => {
loadMore() loadMore();
}, },
{ distance: 10, interval: 1500, canLoadMore: () => canloadMore.value }, { distance: 10, interval: 1500, canLoadMore: () => canloadMore.value },
) );
async function loadMore() { async function loadMore() {
if (isLoading.value || el.value == null) if (isLoading.value || el.value == null)
return return;
isLoading.value = true isLoading.value = true;
try { try {
const more = await fetchList() const more = await fetchList();
data.value.push(...more) data.value.push(...more);
} }
finally { finally {
isLoading.value = false isLoading.value = false;
} }
} }
// //
async function fetchList() { async function fetchList() {
try { try {
pagination.pageNo += 1 pagination.pageNo += 1;
const result = await taskStore.fetchApprovalList({ const result = await taskStore.fetchApprovalList({
...pagination, ...pagination,
keyword: keyword.value, keyword: keyword.value,
userSearchId: searchId.value, userSearchId: searchId.value,
}) });
const { data, pageCount } = result const { data, pageCount } = result;
canloadMore.value = pageCount >= pagination.pageNo canloadMore.value = pageCount >= pagination.pageNo;
return data || [] return data || [];
} }
catch (error) { catch (error) {
canloadMore.value = false canloadMore.value = false;
return [] return [];
} }
} }
watch( watch(
() => taskStore.activeId, () => taskStore.activeId,
(newVal) => { (newVal) => {
activeId.value = newVal activeId.value = newVal;
}, },
) );
watch( watch(
() => taskStore.inFileId, () => taskStore.inFileId,
async (newVal) => { async (newVal) => {
const newlist = [] const newlist = [];
const filterid = newVal.taskname const filterid = newVal.taskname;
console.log(filterid) console.log(filterid);
const index = data.value.findIndex(person => person.fromtaskname === filterid) const index = data.value.findIndex(person => person.fromtaskname === filterid);
const ovelist = data.value.filter(item => item.fromtaskname !== filterid) const ovelist = data.value.filter(item => item.fromtaskname !== filterid);
ovelist.map((item) => { ovelist.map((item) => {
newlist.push(item) newlist.push(item);
return item return item;
}) });
data.value = newlist data.value = newlist;
activeId.value = newlist[index].id activeId.value = newlist[index].id;
taskStore.setActive(index, newlist[index].id) taskStore.setActive(index, newlist[index].id);
// taskStore.setActive(index) // taskStore.setActive(index)
// activeId.value = data[index+1].id // activeId.value = data[index+1].id
// selectHandler(data[index].id, index) // selectHandler(data[index].id, index)
@ -108,55 +108,55 @@ watch(
taskStore.setActive(2) taskStore.setActive(2)
alert(1) */ alert(1) */
}, },
) );
function reset() { function reset() {
pagination.pageNo = 0 pagination.pageNo = 0;
pagination.pageSize = 30 pagination.pageSize = 30;
canloadMore.value = true canloadMore.value = true;
data.value.length = 0 data.value.length = 0;
taskStore.reset() taskStore.reset();
} }
async function search(word: string) { async function search(word: string) {
keyword.value = word keyword.value = word;
reset() reset();
useInfiniteScroll( useInfiniteScroll(
el as any, el as any,
() => { () => {
loadMore() loadMore();
}, },
{ distance: 10, canLoadMore: () => canloadMore.value }, { distance: 10, canLoadMore: () => canloadMore.value },
) );
} }
onMounted(() => { onMounted(() => {
emitter.on('refresh', refreshHandler) emitter.on("refresh", refreshHandler);
emitter.on('filter', async (id) => { emitter.on("filter", async (id) => {
await reset() await reset();
searchId.value = id searchId.value = id;
data.value = await fetchList() data.value = await fetchList();
activeId.value = data.value[0].id activeId.value = data.value[0]?.id;
console.log(data.value) console.log(data.value);
}) });
}) });
onUnmounted(() => { onUnmounted(() => {
emitter.off('refresh', refreshHandler) emitter.off("refresh", refreshHandler);
}) });
async function refreshHandler() { async function refreshHandler() {
search('') search("");
} }
function setStatusName(text) { function setStatusName(text) {
const index = taskStore.getCurrentIndex const index = taskStore.getCurrentIndex;
data.value[index].statshisText = text data.value[index].statshisText = text;
} }
defineExpose({ defineExpose({
search, search,
setStatusName, setStatusName,
}) });
</script> </script>
<template> <template>

Loading…
Cancel
Save