123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281 |
- 'use client'
- import type { MouseEventHandler } from 'react'
- import React from 'react'
- import { useEffect } from 'react'
- import { useState } from 'react'
- import { RiCloseLine } from '@remixicon/react'
- import { useContext } from 'use-context-selector'
- import { useTranslation } from 'react-i18next'
- import cn from '@/utils/classnames'
- import Button from '@/app/components/base/button'
- import Input from '@/app/components/base/input'
- import Textarea from '@/app/components/base/textarea'
- import { SimpleSelect } from '@/app/components/base/select'
- import Modal from '@/app/components/base/modal'
- import { ToastContext } from '@/app/components/base/toast'
- import type { DataSet } from '@/models/datasets'
- import { tagBindingsCreate, tagBindingsRemove, updateDatasetSetting } from '@/service/datasets'
- import { useModalContext } from '@/context/modal-context'
- import {
- fetchDatasetsPermission,
- fetchDeptUserTree,
- fetchTypes,
- setDatasetsPermission,
- } from '@/service/common'
- import { TreeSelect as AntdTreeSelect } from 'antd'
- type RenameDatasetModalProps = {
- show: boolean
- dataset: DataSet
- onSuccess?: () => void
- onClose: () => void
- }
- const RenameDatasetModal = ({ show, dataset, onSuccess, onClose }: RenameDatasetModalProps) => {
- const { t } = useTranslation()
- const { notify } = useContext(ToastContext)
- const [loading, setLoading] = useState(false)
- const [name, setName] = useState<string>(dataset.name)
- const [description, setDescription] = useState<string>(dataset.description)
- const [externalKnowledgeId, setExternalKnowledgeId] = useState<string>(dataset.external_knowledge_info.external_knowledge_id)
- const [externalKnowledgeApiId, setExternalKnowledgeApiId] = useState<string>(dataset.external_knowledge_info.external_knowledge_api_id)
- const [type, setType] = useState<any>(dataset.categories[0]?.id)
- const [editAuth, setEditAuth] = useState()
- const [editUserIds, setEditUserIds] = useState([])
- const [lookUserIds, setLookUserIds] = useState([])
- const [options, setOptions] = useState<any>([])
- useEffect(() => {
- fetchTypes({
- url: '/tags/page',
- params: {
- page: 1,
- limit: 99999,
- tag_type: 'knowledge_category',
- },
- }).then((res: any) => {
- setOptions(res.data.map((v: any) => ({ name: v.name, value: v.id })) || [])
- })
- }, [])
- const onConfirm: MouseEventHandler = async () => {
- if (!name.trim()) {
- notify({ type: 'error', message: t('datasetSettings.form.nameError') })
- return
- }
- try {
- setLoading(true)
- const body: Partial<DataSet> & { external_knowledge_id?: string; external_knowledge_api_id?: string } = {
- name,
- description,
- }
- if (externalKnowledgeId && externalKnowledgeApiId) {
- body.external_knowledge_id = externalKnowledgeId
- body.external_knowledge_api_id = externalKnowledgeApiId
- }
- await updateDatasetSetting({
- datasetId: dataset.id,
- body,
- })
- if (type) {
- if (dataset.categories[0]) {
- await tagBindingsRemove({
- body: {
- tag_id: dataset.categories[0].id,
- target_id: dataset.id,
- type: 'knowledge_category',
- },
- })
- }
- await tagBindingsCreate({
- body: {
- tag_ids: [type],
- target_id: dataset.id,
- type: 'knowledge_category',
- },
- })
- }
- await setDatasetsPermission({
- url: `/datasets/${dataset.id}/permission`,
- body: {
- edit_auth: editAuth,
- edit_permission: editUserIds.map((v: any) => ({ id: v })),
- read_permission: lookUserIds.map((v: any) => ({ id: v })),
- },
- })
- notify({ type: 'success', message: t('common.actionMsg.modifiedSuccessfully') })
- if (onSuccess)
- onSuccess()
- onClose()
- }
- catch (e) {
- notify({ type: 'error', message: t('common.actionMsg.modifiedUnsuccessfully') })
- }
- finally {
- setLoading(false)
- }
- }
- const { setShowAccountSettingModal } = useModalContext()
- const optionsEditAuth = [
- { name: '本账号', value: 1 },
- { name: '本部门', value: 2 },
- ]
- const [optionsDeptUser, setOptionsDeptUser] = useState<any>([])
- const [optionsDeptUserEdit, setOptionsDeptUserEdit] = useState<any>([])
- useEffect(() => {
- fetchDatasetsPermission({
- url: `/datasets/${dataset.id}/permission`,
- }).then((res: any) => {
- setEditAuth(res.edit_auth)
- setEditUserIds(res.edit_permission.map((v: any) => v.id))
- setLookUserIds(res.read_permission.map((v: any) => v.id))
- })
- }, [])
- useEffect(() => {
- fetchDeptUserTree({
- url: '/dept/dept-accounts',
- }).then((res: any) => {
- const deep = (arr: any) => {
- return arr.map((v: any) => {
- v.treeId = v.dept_id || v.account_id
- v.treeName = v.dept_name || v.email
- if (v.children?.length > 0)
- v.treeChildren = deep(v.children)
- else if (v.accounts?.length > 0)
- v.treeChildren = deep(v.accounts)
- return v
- })
- }
- setOptionsDeptUser(deep(res.data) || [])
- })
- }, [])
- useEffect(() => {
- fetchDeptUserTree({
- url: '/dept/dept-accounts',
- }).then((res: any) => {
- const deep = (arr: any) => {
- return arr.map((v: any) => {
- v.treeId = v.dept_id || v.account_id
- v.treeName = v.dept_name || v.email
- if (v.children?.length > 0)
- v.treeChildren = deep(v.children)
- else if (v.accounts?.length > 0)
- v.treeChildren = deep(v.accounts)
- return v
- })
- }
- setOptionsDeptUserEdit(deep(res.data) || [])
- })
- }, [])
- return (
- <Modal
- className='w-[520px] max-w-[520px] rounded-xl px-8 py-6'
- isShow={show}
- onClose={() => { }}
- >
- <div className='relative pb-2 text-xl font-medium leading-[30px] text-text-primary'>{t('datasetSettings.title')}</div>
- <div className='absolute right-4 top-4 cursor-pointer p-2' onClick={onClose}>
- <RiCloseLine className='h-4 w-4 text-text-tertiary' />
- </div>
- <div>
- <div className={cn('flex flex-wrap items-center justify-between py-4')}>
- <div className='flex shrink-0 items-center py-2 text-sm font-medium leading-[20px] text-text-primary'>
- 分类管理
- <div style={{
- color: '#1E98D7',
- }} className='ml-3 cursor-pointer hover:opacity-75'
- onClick={() => setShowAccountSettingModal({ payload: 'type' })}>设置</div>
- </div>
- <div className='w-full'>
- <SimpleSelect
- defaultValue={type}
- onSelect={(i) => { setType(i.value) }}
- items={options}
- allowSearch={false}
- />
- </div>
- </div>
- <div className={cn('flex flex-wrap items-center justify-between py-4')}>
- <div className='shrink-0 py-2 text-sm font-medium leading-[20px] text-text-primary'>
- {t('datasetSettings.form.name')}
- </div>
- <Input
- value={name}
- onChange={e => setName(e.target.value)}
- className='h-9'
- placeholder={t('datasetSettings.form.namePlaceholder') || ''}
- />
- </div>
- <div className={cn('flex flex-wrap items-center justify-between py-4')}>
- <div className='shrink-0 py-2 text-sm font-medium leading-[20px] text-text-primary'>
- {t('datasetSettings.form.desc')}
- </div>
- <div className='w-full'>
- <Textarea
- value={description}
- onChange={e => setDescription(e.target.value)}
- className='resize-none'
- placeholder={t('datasetSettings.form.descPlaceholder') || ''}
- />
- </div>
- </div>
- <div className='pt-2'>
- <div className='py-2 text-sm font-medium leading-[20px] text-text-primary'>编辑权限</div>
- <div className="h-[32px]">
- <SimpleSelect
- className="h-[32px]"
- defaultValue={editAuth}
- onSelect={(i: any) => {
- setEditAuth(i.value)
- }}
- items={optionsEditAuth}
- allowSearch={false}
- placeholder="请选择编辑权限"
- />
- </div>
- </div>
- <div className='pt-2'>
- <div className='py-2 text-sm font-medium leading-[20px] text-text-primary'>编辑授权</div>
- <AntdTreeSelect
- showSearch
- style={{ width: '100%' }}
- value={editUserIds}
- dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
- placeholder="请选择编辑授权"
- allowClear
- treeDefaultExpandAll
- onChange={v => setEditUserIds(v)}
- treeData={optionsDeptUserEdit}
- fieldNames={{ label: 'treeName', value: 'treeId', children: 'treeChildren' }}
- multiple={true}
- treeCheckable={true}
- />
- </div>
- <div className='pt-2'>
- <div className='py-2 text-sm font-medium leading-[20px] text-text-primary'>可见授权</div>
- <AntdTreeSelect
- showSearch
- style={{ width: '100%' }}
- value={lookUserIds}
- dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
- placeholder="请选择可见授权"
- allowClear
- treeDefaultExpandAll
- onChange={v => setLookUserIds(v)}
- treeData={optionsDeptUser}
- fieldNames={{ label: 'treeName', value: 'treeId', children: 'treeChildren' }}
- multiple={true}
- treeCheckable={true}
- />
- </div>
- </div>
- <div className='flex justify-end pt-6'>
- <Button className='mr-2' onClick={onClose}>{t('common.operation.cancel')}</Button>
- <Button disabled={loading} variant="primary" onClick={onConfirm}>{t('common.operation.save')}</Button>
- </div>
- </Modal>
- )
- }
- export default RenameDatasetModal
|