feat(image): add page
This commit is contained in:
59
app/project/detail/components/AdminUserModal.tsx
Normal file
59
app/project/detail/components/AdminUserModal.tsx
Normal file
@@ -0,0 +1,59 @@
|
||||
"use client"
|
||||
|
||||
import { Button, Group, Modal, MultiSelect, Stack } from "@mantine/core"
|
||||
import { useForm } from "@mantine/form"
|
||||
import { useEffect } from "react"
|
||||
|
||||
export default function AdminUserModal(props: {
|
||||
opened: boolean
|
||||
value: number[]
|
||||
options: Array<{ label: string; value: string }>
|
||||
onCloseAction: (next?: number[]) => void
|
||||
}) {
|
||||
const { opened, value, options, onCloseAction } = props
|
||||
|
||||
const form = useForm({
|
||||
initialValues: { users: value.map(String) },
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
if (!opened) return
|
||||
form.setValues({ users: value.map(String) })
|
||||
form.resetDirty()
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [opened, value])
|
||||
|
||||
return (
|
||||
<Modal
|
||||
opened={opened}
|
||||
onClose={() => onCloseAction()}
|
||||
title="编辑项目管理员"
|
||||
centered
|
||||
size={560}>
|
||||
<form
|
||||
onSubmit={form.onSubmit((values) => {
|
||||
const next = values.users
|
||||
.map((v) => Number(v))
|
||||
.filter((v) => Number.isFinite(v))
|
||||
onCloseAction(next)
|
||||
})}>
|
||||
<Stack gap="sm">
|
||||
<MultiSelect
|
||||
label="项目管理员"
|
||||
data={options}
|
||||
searchable
|
||||
clearable
|
||||
value={form.values.users}
|
||||
onChange={(v) => form.setFieldValue("users", v)}
|
||||
/>
|
||||
<Group justify="flex-end" gap="sm">
|
||||
<Button variant="default" onClick={() => onCloseAction()}>
|
||||
取消
|
||||
</Button>
|
||||
<Button type="submit">保存</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</form>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
157
app/project/detail/components/DispatchModal.tsx
Normal file
157
app/project/detail/components/DispatchModal.tsx
Normal file
@@ -0,0 +1,157 @@
|
||||
"use client"
|
||||
|
||||
import { taskDispatch } from "@/components/label/api/task"
|
||||
import { Task } from "@/components/label/api/task/typing"
|
||||
import { usePermissionStore } from "@/components/label/store/auth"
|
||||
import {
|
||||
Button,
|
||||
Group,
|
||||
Modal,
|
||||
Select,
|
||||
Stack,
|
||||
Switch,
|
||||
Text,
|
||||
} from "@mantine/core"
|
||||
import { useForm } from "@mantine/form"
|
||||
import { notifications } from "@mantine/notifications"
|
||||
import { selectedDataProps } from "../TaskTableContainer"
|
||||
import { dispatchOpts } from "./config"
|
||||
|
||||
export default function DispatchModal(props: {
|
||||
opened: boolean
|
||||
dispatchData?: selectedDataProps
|
||||
task_ids: Task.DataProps[]
|
||||
userOptions: Array<{ label: string; value: string }>
|
||||
onCloseAction: (refresh?: boolean) => void
|
||||
}) {
|
||||
const { opened, dispatchData, task_ids, userOptions, onCloseAction } = props
|
||||
const operation_uid = usePermissionStore((s) => s.user_id)
|
||||
|
||||
const form = useForm({
|
||||
initialValues: {
|
||||
reject: false,
|
||||
task_status_dst: "",
|
||||
uid_dst: "",
|
||||
},
|
||||
})
|
||||
|
||||
const taskStatusSrc = dispatchData?.status ?? 0
|
||||
const dstOptions =
|
||||
dispatchOpts[taskStatusSrc]?.opts?.map((o) => ({
|
||||
label: o.label,
|
||||
value: String(o.value),
|
||||
})) ?? []
|
||||
|
||||
return (
|
||||
<Modal
|
||||
opened={opened}
|
||||
onClose={() => onCloseAction()}
|
||||
title="调度任务"
|
||||
centered
|
||||
size={520}>
|
||||
<form
|
||||
onSubmit={form.onSubmit(async (values) => {
|
||||
const opUid =
|
||||
typeof operation_uid === "number"
|
||||
? operation_uid
|
||||
: Number(operation_uid ?? 0)
|
||||
console.log(dispatchData, operation_uid)
|
||||
|
||||
if (!values?.uid_dst || !opUid) {
|
||||
notifications.show({
|
||||
color: "red",
|
||||
title: "操作失败",
|
||||
message: "缺少必要参数",
|
||||
})
|
||||
return
|
||||
}
|
||||
const taskStatusDst = Number(values.task_status_dst)
|
||||
if (!Number.isFinite(taskStatusDst)) {
|
||||
notifications.show({
|
||||
color: "red",
|
||||
title: "校验失败",
|
||||
message: "请选择目标状态",
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
const uidDst = values.uid_dst ? Number(values.uid_dst) : null
|
||||
if (values.uid_dst && !Number.isFinite(uidDst)) {
|
||||
notifications.show({
|
||||
color: "red",
|
||||
title: "校验失败",
|
||||
message: "请选择目标人员",
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
await taskDispatch({
|
||||
operation_uid: opUid,
|
||||
reject: values.reject,
|
||||
task_ids: task_ids.map((item) => item.id),
|
||||
task_status_src: taskStatusSrc,
|
||||
task_status_dst: taskStatusDst,
|
||||
uid_src: dispatchData?.uid ?? null,
|
||||
uid_dst: uidDst,
|
||||
})
|
||||
notifications.show({
|
||||
color: "green",
|
||||
title: "操作成功",
|
||||
message: "已调度任务",
|
||||
})
|
||||
onCloseAction(true)
|
||||
} catch (e) {
|
||||
notifications.show({
|
||||
color: "red",
|
||||
title: "操作失败",
|
||||
message: e instanceof Error ? e.message : "请求失败",
|
||||
})
|
||||
}
|
||||
})}>
|
||||
<Stack gap="sm">
|
||||
<Text size="sm" c="dimmed">
|
||||
当前任务:
|
||||
{task_ids.map((item) => item.project_name).join("、") ?? "-"}
|
||||
</Text>
|
||||
<Text size="sm" c="dimmed">
|
||||
(源状态:{taskStatusSrc})
|
||||
</Text>
|
||||
|
||||
<Select
|
||||
label="目标状态"
|
||||
data={dstOptions}
|
||||
searchable
|
||||
clearable
|
||||
value={form.values.task_status_dst}
|
||||
onChange={(v) => form.setFieldValue("task_status_dst", v ?? "")}
|
||||
/>
|
||||
|
||||
<Select
|
||||
label="目标人员"
|
||||
data={userOptions}
|
||||
searchable
|
||||
clearable
|
||||
value={form.values.uid_dst}
|
||||
onChange={(v) => form.setFieldValue("uid_dst", v ?? "")}
|
||||
/>
|
||||
|
||||
<Switch
|
||||
label="是否返工"
|
||||
checked={form.values.reject}
|
||||
onChange={(e) =>
|
||||
form.setFieldValue("reject", e.currentTarget.checked)
|
||||
}
|
||||
/>
|
||||
|
||||
<Group justify="flex-end" gap="sm">
|
||||
<Button variant="default" onClick={() => onCloseAction()}>
|
||||
取消
|
||||
</Button>
|
||||
<Button type="submit">确定</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</form>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
224
app/project/detail/components/LabelSchemeContainer.tsx
Normal file
224
app/project/detail/components/LabelSchemeContainer.tsx
Normal file
@@ -0,0 +1,224 @@
|
||||
"use client"
|
||||
|
||||
import { ProjectDetail } from "@/components/label/api/project/typing"
|
||||
import {
|
||||
labelTypeMap,
|
||||
selectModeMap,
|
||||
staticsColor,
|
||||
} from "@/components/label/utils/constants"
|
||||
import { Badge, Button, Group, Modal, Paper, Stack, Text } from "@mantine/core"
|
||||
import { DataTable, DataTableColumn } from "mantine-datatable"
|
||||
import { useState } from "react"
|
||||
|
||||
type DetailRow = ProjectDetail.SubAttributesDescribe
|
||||
|
||||
function getColorIndex(color: number[] | undefined) {
|
||||
if (!Array.isArray(color) || color.length < 3) return undefined
|
||||
const key = color.slice(0, 3).join("_")
|
||||
for (const item of staticsColor) {
|
||||
const [colorKey, colorIndex] = Object.entries(item)[0] ?? []
|
||||
if (colorKey === key && typeof colorIndex === "number") {
|
||||
return colorIndex
|
||||
}
|
||||
}
|
||||
return undefined
|
||||
}
|
||||
|
||||
export default function LabelSchemeContainer(props: {
|
||||
info: ProjectDetail.DataProps | undefined
|
||||
}) {
|
||||
const schemas = props.info?.label_schema_list ?? []
|
||||
const [detailOpen, setDetailOpen] = useState(false)
|
||||
const [detailRows, setDetailRows] = useState<DetailRow[]>([])
|
||||
|
||||
const columns: DataTableColumn<ProjectDetail.LabelSchemaList>[] = [
|
||||
{
|
||||
accessor: "label_class",
|
||||
title: "类别",
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
accessor: "super_category",
|
||||
title: "属性",
|
||||
width: 120,
|
||||
render: (record) => record.super_category || "-",
|
||||
},
|
||||
{
|
||||
accessor: "category_id",
|
||||
title: "ID",
|
||||
width: 90,
|
||||
},
|
||||
{
|
||||
accessor: "label_type",
|
||||
title: "标注方式",
|
||||
width: 140,
|
||||
render: (record) => (
|
||||
<Badge variant="light">
|
||||
{labelTypeMap.get(record.label_type) ??
|
||||
String(record.label_type ?? "-")}
|
||||
</Badge>
|
||||
),
|
||||
},
|
||||
{
|
||||
accessor: "color",
|
||||
title: "标签颜色",
|
||||
width: 130,
|
||||
render: (record) => {
|
||||
const color = Array.isArray(record.color) ? record.color : []
|
||||
const idx = getColorIndex(color)
|
||||
if (color.length < 3) {
|
||||
return (
|
||||
<Text size="sm" c="dimmed">
|
||||
-
|
||||
</Text>
|
||||
)
|
||||
}
|
||||
return (
|
||||
<Group gap={8} wrap="nowrap">
|
||||
<div
|
||||
style={{
|
||||
width: 10,
|
||||
height: 10,
|
||||
borderRadius: 999,
|
||||
backgroundColor: `rgb(${color.join(",")})`,
|
||||
border:
|
||||
"1px solid light-dark(var(--mantine-color-gray-4), var(--mantine-color-dark-4))",
|
||||
}}
|
||||
/>
|
||||
<Text size="sm">{idx ?? "-"}</Text>
|
||||
</Group>
|
||||
)
|
||||
},
|
||||
},
|
||||
{
|
||||
accessor: "sub_attributes",
|
||||
title: "子属性",
|
||||
width: 180,
|
||||
render: (record) => {
|
||||
const attrs = Array.isArray(record.sub_attributes)
|
||||
? record.sub_attributes
|
||||
: []
|
||||
return (
|
||||
<Text
|
||||
size="sm"
|
||||
style={{
|
||||
maxWidth: 180,
|
||||
overflow: "hidden",
|
||||
textOverflow: "ellipsis",
|
||||
whiteSpace: "nowrap",
|
||||
}}>
|
||||
{attrs.length ? attrs.join("、") : "-"}
|
||||
</Text>
|
||||
)
|
||||
},
|
||||
},
|
||||
{
|
||||
accessor: "sub_attributes_describe",
|
||||
title: "子属性描述",
|
||||
width: 120,
|
||||
textAlign: "center",
|
||||
render: (record) => {
|
||||
const details = Array.isArray(record.sub_attributes_describe)
|
||||
? record.sub_attributes_describe
|
||||
: []
|
||||
if (!details.length) {
|
||||
return (
|
||||
<Text size="sm" c="dimmed">
|
||||
-
|
||||
</Text>
|
||||
)
|
||||
}
|
||||
return (
|
||||
<Button
|
||||
variant="subtle"
|
||||
size="compact-xs"
|
||||
onClick={() => {
|
||||
setDetailRows(details)
|
||||
setDetailOpen(true)
|
||||
}}>
|
||||
查看
|
||||
</Button>
|
||||
)
|
||||
},
|
||||
},
|
||||
]
|
||||
|
||||
const detailColumns: DataTableColumn<DetailRow>[] = [
|
||||
{
|
||||
accessor: "chinese_name",
|
||||
title: "子属性",
|
||||
width: 140,
|
||||
render: (record) => record.chinese_name || "-",
|
||||
},
|
||||
{
|
||||
accessor: "select_mode",
|
||||
title: "输入方式",
|
||||
width: 100,
|
||||
render: (record) =>
|
||||
selectModeMap.get(record.select_mode) ??
|
||||
String(record.select_mode ?? "-"),
|
||||
},
|
||||
{
|
||||
accessor: "isrequired",
|
||||
title: "是否必填",
|
||||
width: 90,
|
||||
render: (record) => (record.isrequired === 1 ? "是" : "否"),
|
||||
},
|
||||
{
|
||||
accessor: "optional_item",
|
||||
title: "可选属性值",
|
||||
render: (record) => {
|
||||
const opts = Array.isArray(record.optional_item)
|
||||
? record.optional_item
|
||||
: []
|
||||
return opts.length ? opts.join(";") : "-"
|
||||
},
|
||||
},
|
||||
]
|
||||
|
||||
return (
|
||||
<>
|
||||
<Paper
|
||||
withBorder
|
||||
p="sm"
|
||||
radius="md"
|
||||
style={{
|
||||
borderColor:
|
||||
"light-dark(var(--mantine-color-gray-4), var(--mantine-color-dark-4))",
|
||||
}}>
|
||||
<Stack gap="sm">
|
||||
<Text fw={700}>标注方案</Text>
|
||||
<DataTable<ProjectDetail.LabelSchemaList>
|
||||
withTableBorder
|
||||
withRowBorders
|
||||
idAccessor="category_id"
|
||||
records={schemas}
|
||||
columns={columns}
|
||||
minHeight={160}
|
||||
noRecordsText="暂无数据"
|
||||
/>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
<Modal
|
||||
opened={detailOpen}
|
||||
onClose={() => {
|
||||
setDetailOpen(false)
|
||||
setDetailRows([])
|
||||
}}
|
||||
title="子属性描述"
|
||||
centered
|
||||
size="70%">
|
||||
<DataTable<DetailRow>
|
||||
withTableBorder
|
||||
withRowBorders
|
||||
records={detailRows}
|
||||
columns={detailColumns}
|
||||
noRecordsText="暂无数据"
|
||||
minHeight={220}
|
||||
idAccessor="chinese_name"
|
||||
/>
|
||||
</Modal>
|
||||
</>
|
||||
)
|
||||
}
|
||||
278
app/project/detail/components/NoteRulesTable.tsx
Normal file
278
app/project/detail/components/NoteRulesTable.tsx
Normal file
@@ -0,0 +1,278 @@
|
||||
"use client"
|
||||
|
||||
import { projectConfig } from "@/components/label/api/project"
|
||||
import { ProjectDetail } from "@/components/label/api/project/typing"
|
||||
import { usePermissionStore } from "@/components/label/store/auth"
|
||||
import {
|
||||
ActionIcon,
|
||||
Badge,
|
||||
Button,
|
||||
Group,
|
||||
Modal,
|
||||
Paper,
|
||||
Stack,
|
||||
Text,
|
||||
TextInput,
|
||||
} from "@mantine/core"
|
||||
import { modals } from "@mantine/modals"
|
||||
import { notifications } from "@mantine/notifications"
|
||||
import { IconPlus, IconTrash } from "@tabler/icons-react"
|
||||
import dayjs from "dayjs"
|
||||
import { DataTable, DataTableColumn } from "mantine-datatable"
|
||||
import { useMemo, useState } from "react"
|
||||
|
||||
type RulePayload = {
|
||||
text: string
|
||||
create_user: string
|
||||
create_date: string
|
||||
}
|
||||
|
||||
type RuleRow = RulePayload & {
|
||||
index: number
|
||||
}
|
||||
|
||||
function normalizeRule(item: unknown): RulePayload {
|
||||
if (typeof item === "string") {
|
||||
return { text: item, create_user: "-", create_date: "-" }
|
||||
}
|
||||
if (item && typeof item === "object") {
|
||||
const rule = item as {
|
||||
text?: unknown
|
||||
create_user?: unknown
|
||||
create_date?: unknown
|
||||
}
|
||||
return {
|
||||
text: String(rule.text ?? ""),
|
||||
create_user: String(rule.create_user ?? "-"),
|
||||
create_date: String(rule.create_date ?? "-"),
|
||||
}
|
||||
}
|
||||
return { text: "", create_user: "-", create_date: "-" }
|
||||
}
|
||||
|
||||
export default function NoteRulesTable(props: {
|
||||
info: ProjectDetail.DataProps | undefined
|
||||
onUpdated: () => void
|
||||
}) {
|
||||
const { info, onUpdated } = props
|
||||
const projectId = info?.id ?? -1
|
||||
const userName = usePermissionStore((s) => s.user_name)
|
||||
|
||||
const [open, setOpen] = useState(false)
|
||||
const [inputText, setInputText] = useState("")
|
||||
const [saving, setSaving] = useState(false)
|
||||
|
||||
const textRules = useMemo(() => {
|
||||
const rules = (info?.comment_rule as any)?.text_rules
|
||||
return Array.isArray(rules) ? rules.map((r) => String(r ?? "")) : []
|
||||
}, [info?.comment_rule])
|
||||
|
||||
const checkBoxRules = useMemo<RulePayload[]>(() => {
|
||||
const raw = (info?.comment_rule as any)?.check_box_rules
|
||||
const list = Array.isArray(raw) ? raw : []
|
||||
return list.map((item) => normalizeRule(item))
|
||||
}, [info?.comment_rule])
|
||||
|
||||
const rows = useMemo<RuleRow[]>(() => {
|
||||
return checkBoxRules.map((rule, index) => ({ ...rule, index }))
|
||||
}, [checkBoxRules])
|
||||
|
||||
const saveRules = async (nextRules: RulePayload[], successText: string) => {
|
||||
if (projectId === -1) return
|
||||
setSaving(true)
|
||||
try {
|
||||
await projectConfig({
|
||||
project_id: projectId,
|
||||
comment_rule: {
|
||||
check_box_rules: nextRules,
|
||||
text_rules: textRules,
|
||||
},
|
||||
})
|
||||
notifications.show({
|
||||
color: "green",
|
||||
title: "操作成功",
|
||||
message: successText,
|
||||
})
|
||||
setOpen(false)
|
||||
setInputText("")
|
||||
onUpdated()
|
||||
} catch (e) {
|
||||
notifications.show({
|
||||
color: "red",
|
||||
title: "操作失败",
|
||||
message: e instanceof Error ? e.message : "请求失败",
|
||||
})
|
||||
} finally {
|
||||
setSaving(false)
|
||||
}
|
||||
}
|
||||
|
||||
const handleAdd = async () => {
|
||||
const value = inputText.trim()
|
||||
if (!value) {
|
||||
notifications.show({
|
||||
color: "red",
|
||||
title: "新增失败",
|
||||
message: "批注内容不能为空",
|
||||
})
|
||||
return
|
||||
}
|
||||
const exists = rows.some((row) => row.text.trim() === value)
|
||||
if (exists) {
|
||||
notifications.show({
|
||||
color: "red",
|
||||
title: "新增失败",
|
||||
message: "批注规则重复,请重新输入",
|
||||
})
|
||||
return
|
||||
}
|
||||
const next: RulePayload[] = [
|
||||
...checkBoxRules,
|
||||
{
|
||||
text: value,
|
||||
create_user: userName ? String(userName) : "-",
|
||||
create_date: dayjs().format("YYYY-MM-DD"),
|
||||
},
|
||||
]
|
||||
await saveRules(next, "已添加规则")
|
||||
}
|
||||
|
||||
const handleDelete = async (row: RuleRow) => {
|
||||
const next = checkBoxRules.filter((_, index) => index !== row.index)
|
||||
await saveRules(next, "已删除规则")
|
||||
}
|
||||
|
||||
const columns: DataTableColumn<RuleRow>[] = [
|
||||
{
|
||||
accessor: "method",
|
||||
title: "批注方式",
|
||||
width: 90,
|
||||
render: () => <Badge variant="light">勾选</Badge>,
|
||||
},
|
||||
{
|
||||
accessor: "text",
|
||||
title: "内容",
|
||||
},
|
||||
{
|
||||
accessor: "create_user",
|
||||
title: "添加者",
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
accessor: "create_date",
|
||||
title: "添加日期",
|
||||
width: 120,
|
||||
},
|
||||
{
|
||||
accessor: "operation",
|
||||
title: "操作",
|
||||
width: 90,
|
||||
textAlign: "center",
|
||||
render: (record) => (
|
||||
<ActionIcon
|
||||
variant="subtle"
|
||||
color="red"
|
||||
onClick={() => {
|
||||
modals.openConfirmModal({
|
||||
title: "删除规则",
|
||||
centered: true,
|
||||
children: <Text size="sm">确定删除该批注规则吗?</Text>,
|
||||
labels: { confirm: "确定", cancel: "取消" },
|
||||
confirmProps: { color: "red" },
|
||||
onConfirm: () => handleDelete(record),
|
||||
})
|
||||
}}>
|
||||
<IconTrash size={16} />
|
||||
</ActionIcon>
|
||||
),
|
||||
},
|
||||
]
|
||||
|
||||
return (
|
||||
<>
|
||||
<Paper
|
||||
withBorder
|
||||
p="sm"
|
||||
radius="md"
|
||||
style={{
|
||||
borderColor:
|
||||
"light-dark(var(--mantine-color-gray-4), var(--mantine-color-dark-4))",
|
||||
}}>
|
||||
<Stack gap="sm">
|
||||
<Group justify="space-between" wrap="wrap">
|
||||
<Text fw={700}>批注规则</Text>
|
||||
<Button
|
||||
size="xs"
|
||||
leftSection={<IconPlus size={14} />}
|
||||
onClick={() => {
|
||||
setInputText("")
|
||||
setOpen(true)
|
||||
}}>
|
||||
添加规则
|
||||
</Button>
|
||||
</Group>
|
||||
|
||||
<Stack gap={4}>
|
||||
<Text size="sm" fw={600}>
|
||||
文本规则
|
||||
</Text>
|
||||
<Text size="sm" c="dimmed">
|
||||
{textRules.length ? textRules.join(";") : "-"}
|
||||
</Text>
|
||||
</Stack>
|
||||
|
||||
<DataTable<RuleRow>
|
||||
withTableBorder
|
||||
withRowBorders
|
||||
records={rows}
|
||||
columns={columns}
|
||||
noRecordsText="暂无规则"
|
||||
minHeight={200}
|
||||
idAccessor={(record) =>
|
||||
`${record.index}_${record.text}_${record.create_user}_${record.create_date}`
|
||||
}
|
||||
/>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
<Modal
|
||||
opened={open}
|
||||
onClose={() => {
|
||||
if (saving) return
|
||||
setOpen(false)
|
||||
setInputText("")
|
||||
}}
|
||||
title="添加批注规则"
|
||||
centered>
|
||||
<Stack gap="sm">
|
||||
<Group gap="sm">
|
||||
<Text size="sm" c="dimmed">
|
||||
批注方式
|
||||
</Text>
|
||||
<Badge variant="light">勾选</Badge>
|
||||
</Group>
|
||||
<TextInput
|
||||
label="批注内容"
|
||||
placeholder="请输入批注内容"
|
||||
value={inputText}
|
||||
onChange={(e) => setInputText(e.currentTarget.value)}
|
||||
/>
|
||||
<Group justify="flex-end" gap="sm">
|
||||
<Button
|
||||
variant="default"
|
||||
onClick={() => {
|
||||
setOpen(false)
|
||||
setInputText("")
|
||||
}}
|
||||
disabled={saving}>
|
||||
取消
|
||||
</Button>
|
||||
<Button onClick={handleAdd} loading={saving}>
|
||||
保存
|
||||
</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Modal>
|
||||
</>
|
||||
)
|
||||
}
|
||||
90
app/project/detail/components/ReleaseModal.tsx
Normal file
90
app/project/detail/components/ReleaseModal.tsx
Normal file
@@ -0,0 +1,90 @@
|
||||
"use client"
|
||||
|
||||
import { taskRelease } from "@/components/label/api/task"
|
||||
import { Task } from "@/components/label/api/task/typing"
|
||||
import { usePermissionStore } from "@/components/label/store/auth"
|
||||
import { Button, Group, Modal, Stack, Switch, Text } from "@mantine/core"
|
||||
import { useForm } from "@mantine/form"
|
||||
import { notifications } from "@mantine/notifications"
|
||||
|
||||
export default function ReleaseModal(props: {
|
||||
opened: boolean
|
||||
record: Task.DataProps | null
|
||||
onCloseAction: (refresh?: boolean) => void
|
||||
}) {
|
||||
const { opened, record, onCloseAction } = props
|
||||
const operation_uid = usePermissionStore((s) => s.user_id)
|
||||
|
||||
const form = useForm({
|
||||
initialValues: {
|
||||
reject: false,
|
||||
},
|
||||
})
|
||||
|
||||
return (
|
||||
<Modal
|
||||
opened={opened}
|
||||
onClose={() => onCloseAction()}
|
||||
title="释放任务"
|
||||
centered
|
||||
size={520}>
|
||||
<form
|
||||
onSubmit={form.onSubmit(async (values) => {
|
||||
const opUid =
|
||||
typeof operation_uid === "number"
|
||||
? operation_uid
|
||||
: Number(operation_uid ?? 0)
|
||||
if (!record?.id || !opUid || !record.current_uid) {
|
||||
notifications.show({
|
||||
color: "red",
|
||||
title: "操作失败",
|
||||
message: "缺少必要参数",
|
||||
})
|
||||
return
|
||||
}
|
||||
try {
|
||||
await taskRelease({
|
||||
operation_uid: opUid,
|
||||
reject: values.reject,
|
||||
task_ids: [record.id],
|
||||
task_status: record.label_status,
|
||||
uid: record.current_uid,
|
||||
})
|
||||
notifications.show({
|
||||
color: "green",
|
||||
title: "操作成功",
|
||||
message: "已释放任务",
|
||||
})
|
||||
onCloseAction(true)
|
||||
} catch (e) {
|
||||
notifications.show({
|
||||
color: "red",
|
||||
title: "操作失败",
|
||||
message: e instanceof Error ? e.message : "请求失败",
|
||||
})
|
||||
}
|
||||
})}>
|
||||
<Stack gap="sm">
|
||||
<Text size="sm" c="dimmed">
|
||||
当前任务:{record?.id ?? "-"}(状态:{record?.label_status ?? "-"})
|
||||
</Text>
|
||||
<Switch
|
||||
label="是否返工"
|
||||
checked={form.values.reject}
|
||||
onChange={(e) =>
|
||||
form.setFieldValue("reject", e.currentTarget.checked)
|
||||
}
|
||||
/>
|
||||
<Group justify="flex-end" gap="sm">
|
||||
<Button variant="default" onClick={() => onCloseAction()}>
|
||||
取消
|
||||
</Button>
|
||||
<Button type="submit" color="red">
|
||||
确定释放
|
||||
</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</form>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
172
app/project/detail/components/SamplingPlanContainer.tsx
Normal file
172
app/project/detail/components/SamplingPlanContainer.tsx
Normal file
@@ -0,0 +1,172 @@
|
||||
"use client"
|
||||
|
||||
import { projectConfig } from "@/components/label/api/project"
|
||||
import { ProjectDetail } from "@/components/label/api/project/typing"
|
||||
import {
|
||||
Button,
|
||||
Checkbox,
|
||||
Group,
|
||||
NumberInput,
|
||||
Paper,
|
||||
SimpleGrid,
|
||||
Stack,
|
||||
Text,
|
||||
} from "@mantine/core"
|
||||
import { useForm } from "@mantine/form"
|
||||
import { notifications } from "@mantine/notifications"
|
||||
import { useEffect } from "react"
|
||||
|
||||
type GradeKey = "A" | "B" | "C"
|
||||
|
||||
export default function SamplingPlanContainer(props: {
|
||||
projectId: number
|
||||
info: ProjectDetail.DataProps | undefined
|
||||
onUpdated: () => void
|
||||
}) {
|
||||
const { projectId, info, onUpdated } = props
|
||||
|
||||
const form = useForm({
|
||||
initialValues: {
|
||||
check_task: false,
|
||||
check_frame: false,
|
||||
A_task: 0,
|
||||
A_frame: 0,
|
||||
B_task: 0,
|
||||
B_frame: 0,
|
||||
C_task: 0,
|
||||
C_frame: 0,
|
||||
},
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
if (!info) return
|
||||
const grade = info.user_grade ?? ({} as any)
|
||||
const toPercent = (v?: number) => Number(((v ?? 0) * 100).toFixed(2))
|
||||
form.setValues({
|
||||
check_task: !!info.check_task,
|
||||
check_frame: !!info.check_frame,
|
||||
A_task: toPercent(grade.A?.task),
|
||||
A_frame: toPercent(grade.A?.frame),
|
||||
B_task: toPercent(grade.B?.task),
|
||||
B_frame: toPercent(grade.B?.frame),
|
||||
C_task: toPercent(grade.C?.task),
|
||||
C_frame: toPercent(grade.C?.frame),
|
||||
})
|
||||
form.resetDirty()
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [info])
|
||||
|
||||
const save = async () => {
|
||||
try {
|
||||
const toRatio = (v: number) => Number((v / 100).toFixed(4))
|
||||
await projectConfig({
|
||||
project_id: projectId,
|
||||
check_task: form.values.check_task,
|
||||
check_frame: form.values.check_frame,
|
||||
user_grade: {
|
||||
A: {
|
||||
task: toRatio(form.values.A_task),
|
||||
frame: toRatio(form.values.A_frame),
|
||||
},
|
||||
B: {
|
||||
task: toRatio(form.values.B_task),
|
||||
frame: toRatio(form.values.B_frame),
|
||||
},
|
||||
C: {
|
||||
task: toRatio(form.values.C_task),
|
||||
frame: toRatio(form.values.C_frame),
|
||||
},
|
||||
},
|
||||
})
|
||||
notifications.show({
|
||||
color: "green",
|
||||
title: "操作成功",
|
||||
message: "已保存抽检配置",
|
||||
})
|
||||
onUpdated()
|
||||
} catch (e) {
|
||||
notifications.show({
|
||||
color: "red",
|
||||
title: "操作失败",
|
||||
message: e instanceof Error ? e.message : "请求失败",
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<Paper
|
||||
withBorder
|
||||
p="sm"
|
||||
radius="md"
|
||||
style={{
|
||||
borderColor:
|
||||
"light-dark(var(--mantine-color-gray-4), var(--mantine-color-dark-4))",
|
||||
}}>
|
||||
<Stack gap="sm">
|
||||
<Group justify="space-between" wrap="wrap">
|
||||
<Text fw={700}>抽检方案</Text>
|
||||
<Button size="xs" onClick={save}>
|
||||
保存
|
||||
</Button>
|
||||
</Group>
|
||||
|
||||
<Group gap="md" wrap="wrap">
|
||||
<Checkbox
|
||||
label="抽检任务"
|
||||
checked={form.values.check_task}
|
||||
onChange={(e) =>
|
||||
form.setFieldValue("check_task", e.currentTarget.checked)
|
||||
}
|
||||
/>
|
||||
<Checkbox
|
||||
label="抽检帧"
|
||||
checked={form.values.check_frame}
|
||||
onChange={(e) =>
|
||||
form.setFieldValue("check_frame", e.currentTarget.checked)
|
||||
}
|
||||
/>
|
||||
</Group>
|
||||
|
||||
<SimpleGrid cols={{ base: 1, sm: 3 }} spacing="sm">
|
||||
{(["A", "B", "C"] as GradeKey[]).map((g) => (
|
||||
<Paper
|
||||
key={g}
|
||||
withBorder
|
||||
p="sm"
|
||||
radius="md"
|
||||
style={{
|
||||
borderColor:
|
||||
"light-dark(var(--mantine-color-gray-4), var(--mantine-color-dark-4))",
|
||||
}}>
|
||||
<Stack gap="xs">
|
||||
<Text fw={600}>等级 {g}</Text>
|
||||
<NumberInput
|
||||
label="任务抽检比例(%)"
|
||||
min={0}
|
||||
max={100}
|
||||
decimalScale={2}
|
||||
value={form.values[`${g}_task` as const]}
|
||||
onChange={(v) =>
|
||||
form.setFieldValue(`${g}_task` as any, Number(v ?? 0))
|
||||
}
|
||||
hideControls
|
||||
/>
|
||||
<NumberInput
|
||||
label="帧抽检比例(%)"
|
||||
min={0}
|
||||
max={100}
|
||||
decimalScale={2}
|
||||
value={form.values[`${g}_frame` as const]}
|
||||
onChange={(v) =>
|
||||
form.setFieldValue(`${g}_frame` as any, Number(v ?? 0))
|
||||
}
|
||||
hideControls
|
||||
/>
|
||||
</Stack>
|
||||
</Paper>
|
||||
))}
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Paper>
|
||||
)
|
||||
}
|
||||
60
app/project/detail/components/StageUserModal.tsx
Normal file
60
app/project/detail/components/StageUserModal.tsx
Normal file
@@ -0,0 +1,60 @@
|
||||
"use client"
|
||||
|
||||
import { Button, Group, Modal, MultiSelect, Stack } from "@mantine/core"
|
||||
import { useForm } from "@mantine/form"
|
||||
import { useEffect } from "react"
|
||||
|
||||
export default function StageUserModal(props: {
|
||||
opened: boolean
|
||||
title: string
|
||||
value: number[]
|
||||
options: Array<{ label: string; value: string }>
|
||||
onCloseAction: (next?: number[]) => void
|
||||
}) {
|
||||
const { opened, title, value, options, onCloseAction } = props
|
||||
|
||||
const form = useForm({
|
||||
initialValues: { users: value.map(String) },
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
if (!opened) return
|
||||
form.setValues({ users: value.map(String) })
|
||||
form.resetDirty()
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [opened, value])
|
||||
|
||||
return (
|
||||
<Modal
|
||||
opened={opened}
|
||||
onClose={() => onCloseAction()}
|
||||
title={title}
|
||||
centered
|
||||
size={560}>
|
||||
<form
|
||||
onSubmit={form.onSubmit((values) => {
|
||||
const next = values.users
|
||||
.map((v) => Number(v))
|
||||
.filter((v) => Number.isFinite(v))
|
||||
onCloseAction(next)
|
||||
})}>
|
||||
<Stack gap="sm">
|
||||
<MultiSelect
|
||||
label="人员"
|
||||
data={options}
|
||||
searchable
|
||||
clearable
|
||||
value={form.values.users}
|
||||
onChange={(v) => form.setFieldValue("users", v)}
|
||||
/>
|
||||
<Group justify="flex-end" gap="sm">
|
||||
<Button variant="default" onClick={() => onCloseAction()}>
|
||||
取消
|
||||
</Button>
|
||||
<Button type="submit">保存</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</form>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
1537
app/project/detail/components/TaskStageTabsContainer.tsx
Normal file
1537
app/project/detail/components/TaskStageTabsContainer.tsx
Normal file
File diff suppressed because it is too large
Load Diff
50
app/project/detail/components/TaskStatusTag.tsx
Normal file
50
app/project/detail/components/TaskStatusTag.tsx
Normal file
@@ -0,0 +1,50 @@
|
||||
"use client"
|
||||
|
||||
import { TaskStatusEnum } from "@/components/label/utils/constants"
|
||||
import { Badge, Group } from "@mantine/core"
|
||||
import { useMemo } from "react"
|
||||
|
||||
function statusColor(status?: number | null) {
|
||||
switch (status) {
|
||||
case 1:
|
||||
return "yellow"
|
||||
case 2:
|
||||
case 4:
|
||||
case 6:
|
||||
return "blue"
|
||||
case 3:
|
||||
case 5:
|
||||
case 7:
|
||||
return "green"
|
||||
case 8:
|
||||
return "red"
|
||||
default:
|
||||
return "gray"
|
||||
}
|
||||
}
|
||||
|
||||
export default function TaskStatusTag(props: {
|
||||
status: number
|
||||
rejected?: boolean
|
||||
center?: boolean
|
||||
}) {
|
||||
const text = useMemo(
|
||||
() => TaskStatusEnum.get(props.status) || "默认",
|
||||
[props.status]
|
||||
)
|
||||
return (
|
||||
<Group
|
||||
gap={6}
|
||||
justify={props.center ? "center" : "flex-start"}
|
||||
wrap="nowrap">
|
||||
<Badge color={statusColor(props.status)} size="sm">
|
||||
{text}
|
||||
</Badge>
|
||||
{props.rejected ? (
|
||||
<Badge variant="outline" color="yellow" size="sm">
|
||||
返工
|
||||
</Badge>
|
||||
) : null}
|
||||
</Group>
|
||||
)
|
||||
}
|
||||
80
app/project/detail/components/WorkflowModal.tsx
Normal file
80
app/project/detail/components/WorkflowModal.tsx
Normal file
@@ -0,0 +1,80 @@
|
||||
"use client"
|
||||
|
||||
import { getTaskWorkFlow } from "@/components/label/api/task"
|
||||
import { Button, Group, Modal, ScrollArea, Stack, Text } from "@mantine/core"
|
||||
import { notifications } from "@mantine/notifications"
|
||||
import { useEffect, useState } from "react"
|
||||
|
||||
export default function WorkflowModal(props: {
|
||||
opened: boolean
|
||||
taskId: number | null
|
||||
onCloseAction: () => void
|
||||
}) {
|
||||
const { opened, taskId, onCloseAction } = props
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [records, setRecords] = useState<any[]>([])
|
||||
|
||||
useEffect(() => {
|
||||
if (!opened || !taskId) return
|
||||
const run = async () => {
|
||||
setLoading(true)
|
||||
try {
|
||||
const res = await getTaskWorkFlow(taskId)
|
||||
setRecords(res ?? [])
|
||||
} catch (e) {
|
||||
setRecords([])
|
||||
notifications.show({
|
||||
color: "red",
|
||||
title: "加载失败",
|
||||
message: e instanceof Error ? e.message : "请求失败",
|
||||
})
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
run()
|
||||
}, [opened, taskId])
|
||||
|
||||
return (
|
||||
<Modal
|
||||
opened={opened}
|
||||
onClose={onCloseAction}
|
||||
title="工作流"
|
||||
centered
|
||||
size={720}>
|
||||
<Stack gap="sm">
|
||||
<ScrollArea h={360} type="auto">
|
||||
<Stack gap="xs">
|
||||
{records.length ? (
|
||||
records.map((r, idx) => (
|
||||
<Text
|
||||
key={idx}
|
||||
size="sm"
|
||||
style={{
|
||||
fontFamily:
|
||||
'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace',
|
||||
whiteSpace: "pre-wrap",
|
||||
wordBreak: "break-word",
|
||||
background: "rgba(0,0,0,0.03)",
|
||||
borderRadius: 6,
|
||||
padding: 10,
|
||||
}}>
|
||||
{JSON.stringify(r, null, 2)}
|
||||
</Text>
|
||||
))
|
||||
) : (
|
||||
<Text size="sm" c="dimmed">
|
||||
{loading ? "加载中..." : "暂无数据"}
|
||||
</Text>
|
||||
)}
|
||||
</Stack>
|
||||
</ScrollArea>
|
||||
<Group justify="flex-end">
|
||||
<Button variant="default" onClick={onCloseAction}>
|
||||
关闭
|
||||
</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
151
app/project/detail/components/config.ts
Normal file
151
app/project/detail/components/config.ts
Normal file
@@ -0,0 +1,151 @@
|
||||
type FormItemProps = {
|
||||
label: string
|
||||
name: string
|
||||
type: "input" | "select" | "radio"
|
||||
options?: Array<{ label: any; value: any }>
|
||||
}
|
||||
|
||||
const monthOpt = Array.from({ length: 12 }).map((_, idx) => {
|
||||
const n = idx + 1
|
||||
return { label: n, value: n }
|
||||
})
|
||||
|
||||
export const confirmOpt = [
|
||||
{ label: "否", value: false },
|
||||
{ label: "是", value: true },
|
||||
]
|
||||
|
||||
export const labelStageConfig: FormItemProps[] = [
|
||||
{ label: "可领取最多任务条数", name: "max_size", type: "input" },
|
||||
{ label: "单次可领取任务条数", name: "acquire_size", type: "input" },
|
||||
{
|
||||
label: "标注配置更新月份",
|
||||
name: "label_update_month",
|
||||
type: "select",
|
||||
options: monthOpt,
|
||||
},
|
||||
{ label: "动态标注倍速", name: "dynamic_label_speed", type: "input" },
|
||||
{ label: "静态标注倍速", name: "static_label_speed", type: "input" },
|
||||
{ label: "标注准确率", name: "label_accuracy_rate", type: "input" },
|
||||
{ label: "标注结果数量倍数", name: "avg_remind_threshold", type: "input" },
|
||||
{
|
||||
label: "标注结果数量告警阈值",
|
||||
name: "fix_remind_threshold",
|
||||
type: "input",
|
||||
},
|
||||
{
|
||||
label: "领取顺序",
|
||||
name: "acquire_mode",
|
||||
type: "radio",
|
||||
options: [
|
||||
{ label: "顺序领取", value: 0 },
|
||||
{ label: "乱序领取", value: 1 },
|
||||
],
|
||||
},
|
||||
]
|
||||
|
||||
export const reviewStageConfig: FormItemProps[] = [
|
||||
{ label: "可领取最多任务条数", name: "max_size", type: "input" },
|
||||
{ label: "单次可领取任务条数", name: "acquire_size", type: "input" },
|
||||
{
|
||||
label: "审核配置更新月份",
|
||||
name: "review1_update_month",
|
||||
type: "select",
|
||||
options: monthOpt,
|
||||
},
|
||||
{ label: "动态审核倍速", name: "dynamic_review1_speed", type: "input" },
|
||||
{ label: "静态审核倍速", name: "static_review1_speed", type: "input" },
|
||||
{ label: "审核准确率", name: "review1_accuracy_rate", type: "input" },
|
||||
{
|
||||
label: "领取顺序",
|
||||
name: "acquire_mode",
|
||||
type: "radio",
|
||||
options: [
|
||||
{ label: "顺序领取", value: 0 },
|
||||
{ label: "乱序领取", value: 1 },
|
||||
],
|
||||
},
|
||||
]
|
||||
|
||||
export const recheckStageConfig: FormItemProps[] = [
|
||||
{ label: "可领取最多任务条数", name: "max_size", type: "input" },
|
||||
{ label: "单次可领取任务条数", name: "acquire_size", type: "input" },
|
||||
{
|
||||
label: "复审配置更新月份",
|
||||
name: "review2_update_month",
|
||||
type: "select",
|
||||
options: monthOpt,
|
||||
},
|
||||
{ label: "动态复审倍速", name: "dynamic_review2_speed", type: "input" },
|
||||
{ label: "静态复审倍速", name: "static_review2_speed", type: "input" },
|
||||
{
|
||||
label: "领取顺序",
|
||||
name: "acquire_mode",
|
||||
type: "radio",
|
||||
options: [
|
||||
{ label: "顺序领取", value: 0 },
|
||||
{ label: "乱序领取", value: 1 },
|
||||
],
|
||||
},
|
||||
]
|
||||
|
||||
export const dispatchOpts: Record<
|
||||
number,
|
||||
{ label: string; opts: Array<{ label: string; value: number }> }
|
||||
> = {
|
||||
1: {
|
||||
label: "待领取",
|
||||
opts: [{ label: "标注中", value: 2 }],
|
||||
},
|
||||
2: {
|
||||
label: "标注中",
|
||||
opts: [
|
||||
{ label: "标注中", value: 2 },
|
||||
{ label: "审核中", value: 4 },
|
||||
],
|
||||
},
|
||||
3: {
|
||||
label: "标注完成",
|
||||
opts: [
|
||||
{ label: "标注中", value: 2 },
|
||||
{ label: "审核中", value: 4 },
|
||||
],
|
||||
},
|
||||
4: {
|
||||
label: "审核中",
|
||||
opts: [
|
||||
{ label: "标注中", value: 2 },
|
||||
{ label: "审核中", value: 4 },
|
||||
{ label: "复审中", value: 6 },
|
||||
],
|
||||
},
|
||||
5: {
|
||||
label: "审核完成",
|
||||
opts: [
|
||||
{ label: "标注中", value: 2 },
|
||||
{ label: "审核中", value: 4 },
|
||||
{ label: "复审中", value: 6 },
|
||||
{ label: "复审完成", value: 7 },
|
||||
],
|
||||
},
|
||||
6: {
|
||||
label: "复审中",
|
||||
opts: [
|
||||
{ label: "标注中", value: 2 },
|
||||
{ label: "审核中", value: 4 },
|
||||
{ label: "复审中", value: 6 },
|
||||
],
|
||||
},
|
||||
7: {
|
||||
label: "复审完成",
|
||||
opts: [
|
||||
{ label: "标注中", value: 2 },
|
||||
{ label: "审核中", value: 4 },
|
||||
{ label: "复审中", value: 6 },
|
||||
],
|
||||
},
|
||||
8: {
|
||||
label: "无法标注",
|
||||
opts: [{ label: "标注中", value: 2 }],
|
||||
},
|
||||
}
|
||||
Reference in New Issue
Block a user