all
This commit is contained in:
parent
bfea69686b
commit
62b4d710b3
|
@ -15,14 +15,15 @@ import {
|
||||||
RepSelectNotification,
|
RepSelectNotification,
|
||||||
SearchNotification
|
SearchNotification
|
||||||
} from './styles'
|
} from './styles'
|
||||||
import { T_ColumnsState, T_NewRepository, T_RepositoryItem } from './types'
|
import { T_ColumnsState, T_RepositoryItem } from './types'
|
||||||
|
|
||||||
|
|
||||||
type Props = {}
|
type Props = {}
|
||||||
|
|
||||||
export default function Repository({}: Props) {
|
export default function Repository({}: Props) {
|
||||||
|
const [firstLoadingState, setFirstLoadingState] = useState(true)
|
||||||
|
const [loadingState, setLoadingState] = useState(false)
|
||||||
const [errorState, setErrorState] = useState(false)
|
const [errorState, setErrorState] = useState(false)
|
||||||
const [loadingState, setLoadingState] = useState(true)
|
|
||||||
const [searchNotification, setSearchNotification] = useState(false)
|
const [searchNotification, setSearchNotification] = useState(false)
|
||||||
const [totalCount, setTotalCount] = useState(0)
|
const [totalCount, setTotalCount] = useState(0)
|
||||||
|
|
||||||
|
@ -40,16 +41,27 @@ export default function Repository({}: Props) {
|
||||||
})
|
})
|
||||||
|
|
||||||
const getRep = async () => {
|
const getRep = async () => {
|
||||||
setSearchNotification(false)
|
if (!firstLoadingState) setLoadingState(true)
|
||||||
const response = await RepositoryService.getRepository(queryParams)
|
setErrorState(false)
|
||||||
if (response.status === 200) {
|
try {
|
||||||
response.data.Data.length === 0
|
const response = await RepositoryService.getRepository(queryParams)
|
||||||
? setSearchNotification(true)
|
if (response.status === 200) {
|
||||||
: (setRepository(response.data.Data),
|
response.data.Data.length === 0
|
||||||
setTotalCount(response.data.Total))
|
? setSearchNotification(true)
|
||||||
|
: (setRepository(response.data.Data),
|
||||||
|
setTotalCount(response.data.Total),
|
||||||
|
setSearchNotification(false))
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
setErrorState(true)
|
||||||
}
|
}
|
||||||
|
|
||||||
setLoadingState(false)
|
setLoadingState(false)
|
||||||
|
setFirstLoadingState(false)
|
||||||
}
|
}
|
||||||
|
useEffect(() => {
|
||||||
|
getRep()
|
||||||
|
}, [])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
getRep()
|
getRep()
|
||||||
|
@ -70,10 +82,15 @@ export default function Repository({}: Props) {
|
||||||
const [notChecked, setNotChecked] = useState<number[]>([])
|
const [notChecked, setNotChecked] = useState<number[]>([])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
notChecked.length === Repository.length &&
|
!errorState ||
|
||||||
(setSelectAll(false), setNotChecked([]))
|
loadingState ||
|
||||||
|
(firstLoadingState &&
|
||||||
|
notChecked.length === Repository .length &&
|
||||||
|
(setSelectAll(false), setNotChecked([])))
|
||||||
}, [notChecked])
|
}, [notChecked])
|
||||||
|
|
||||||
|
const [modal, setModal] = useState(false)
|
||||||
|
|
||||||
const groupDelete = async () => {
|
const groupDelete = async () => {
|
||||||
const deletePromises = checkedColumns.map((item) =>
|
const deletePromises = checkedColumns.map((item) =>
|
||||||
RepositoryService.deleteRepository(item)
|
RepositoryService.deleteRepository(item)
|
||||||
|
@ -101,33 +118,7 @@ export default function Repository({}: Props) {
|
||||||
getRep()
|
getRep()
|
||||||
}
|
}
|
||||||
|
|
||||||
const [newRep, setNewRep] = useState<T_NewRepository>({
|
|
||||||
Name: '',
|
|
||||||
Description: '',
|
|
||||||
ShortDescription: '',
|
|
||||||
Version: '',
|
|
||||||
Category: '',
|
|
||||||
})
|
|
||||||
|
|
||||||
const [modal, setModal] = useState(false)
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
console.log(Repository)
|
|
||||||
}, [Repository])
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
setNewRep({
|
|
||||||
Name: '',
|
|
||||||
Description: '',
|
|
||||||
ShortDescription: '',
|
|
||||||
Version: '',
|
|
||||||
Category: '',
|
|
||||||
})
|
|
||||||
}, [modal])
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
getRep()
|
|
||||||
}, [])
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
@ -215,15 +206,10 @@ export default function Repository({}: Props) {
|
||||||
</>
|
</>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
<NewRepModal
|
|
||||||
modal={modal}
|
|
||||||
setModal={setModal}
|
|
||||||
newRep={newRep}
|
|
||||||
setNewRep={setNewRep}
|
|
||||||
getRep={getRep}
|
|
||||||
/>
|
|
||||||
</RepContainer>
|
</RepContainer>
|
||||||
)}
|
)}
|
||||||
|
<NewRepModal modal={modal} setModal={setModal} getRep={getRep} />
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,15 +1,28 @@
|
||||||
import { useEffect, useState } from 'react'
|
import { useEffect, useRef, useState } from 'react'
|
||||||
import MainButton from 'src/components/UI/button/MainButton'
|
import MainButton from 'src/components/UI/button/MainButton'
|
||||||
import MainInput from 'src/components/UI/input/MainInput'
|
import MainInput from 'src/components/UI/input/MainInput'
|
||||||
import Modal from 'src/components/UI/modal/Modal'
|
import Modal from 'src/components/UI/modal/Modal'
|
||||||
|
import Textarea from 'src/components/UI/input/Textarea'
|
||||||
|
import RepositoryService from 'src/services/repositoryServices'
|
||||||
import styled from 'styled-components'
|
import styled from 'styled-components'
|
||||||
import { T_NewRepository } from '../types'
|
import { T_NewRepository, T_RepositoryItem } from '../types'
|
||||||
|
|
||||||
|
const NewRepErrorMessageContainer = styled.div`
|
||||||
|
position: relative;
|
||||||
|
z-index: 4;
|
||||||
|
`
|
||||||
|
|
||||||
|
const NewRepErrorMessage = styled.div`
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: end;
|
||||||
|
gap: 20px;
|
||||||
|
`
|
||||||
type Props = {
|
type Props = {
|
||||||
modal: boolean
|
modal: boolean
|
||||||
setModal: (param: boolean) => void
|
setModal: (param: boolean) => void
|
||||||
repository: T_NewRepository
|
repository: T_RepositoryItem
|
||||||
editRep: (param: T_NewRepository) => void
|
getRep: () => void
|
||||||
}
|
}
|
||||||
|
|
||||||
const ModalContainer = styled.div`
|
const ModalContainer = styled.div`
|
||||||
|
@ -23,21 +36,46 @@ const ModalContainer = styled.div`
|
||||||
gap: 20px;
|
gap: 20px;
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
|
const NewRepFileBlock = styled.div`
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
export default function EditRepModal({
|
input {
|
||||||
modal,
|
display: none;
|
||||||
setModal,
|
}
|
||||||
repository,
|
p {
|
||||||
editRep
|
font-size: 18px;
|
||||||
}: Props) {
|
}
|
||||||
const [editRepData, setEditRepData] = useState(repository)
|
|
||||||
|
|
||||||
//const [errorMessage, setErrorMessage] = useState(false)
|
span {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
export default function EditRepModal({ modal, setModal, repository, getRep }: Props){
|
||||||
|
const [error, setError] = useState({
|
||||||
|
state: false,
|
||||||
|
message: ''
|
||||||
|
})
|
||||||
|
|
||||||
|
const [loading, setLoading] = useState(false)
|
||||||
|
|
||||||
|
const setErrorState = (value: boolean) => {
|
||||||
|
setError({ ...error, state: value })
|
||||||
|
}
|
||||||
|
|
||||||
|
const [editRepData, setEditRepData] = useState<T_NewRepository>({
|
||||||
|
Name: repository.Name,
|
||||||
|
Description: repository.Description,
|
||||||
|
ShortDescription: repository.ShortDescription,
|
||||||
|
Version: repository.Version,
|
||||||
|
Category: repository.Category
|
||||||
|
})
|
||||||
|
|
||||||
const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
setEditRepData({ ...editRepData, Name: e.target.value })
|
setEditRepData({ ...editRepData, Name: e.target.value })
|
||||||
}
|
}
|
||||||
const handleDescriptionChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
const handleDescriptionChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
|
||||||
setEditRepData({ ...editRepData, Description: e.target.value })
|
setEditRepData({ ...editRepData, Description: e.target.value })
|
||||||
}
|
}
|
||||||
const handleShortDescriptionChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
const handleShortDescriptionChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
|
@ -50,13 +88,70 @@ export default function EditRepModal({
|
||||||
setEditRepData({ ...editRepData, Category: e.target.value })
|
setEditRepData({ ...editRepData, Category: e.target.value })
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const [formValid, setFormValid] = useState(false)
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setEditRepData({ ...editRepData,})
|
setFormValid(
|
||||||
}, [])
|
editRepData.Name !== '' &&
|
||||||
|
editRepData.Description !== '' &&
|
||||||
|
editRepData.ShortDescription !== '' &&
|
||||||
|
editRepData.Version !== '' &&
|
||||||
|
editRepData.Category !== ''
|
||||||
|
)
|
||||||
|
}, [editRepData])
|
||||||
|
const fileInputRef = useRef<HTMLInputElement>(null);
|
||||||
|
const [selectedFile, setSelectedFile] = useState<File | null>(null);
|
||||||
|
|
||||||
|
const handleFileChange = () => {
|
||||||
|
const file = fileInputRef.current?.files?.[0]
|
||||||
|
if (file) {
|
||||||
|
setSelectedFile(file)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleFileClick = () => {
|
||||||
|
fileInputRef.current?.click()
|
||||||
|
}
|
||||||
|
const updateRep = async () => {
|
||||||
|
setLoading(true)
|
||||||
|
try {
|
||||||
|
if (
|
||||||
|
!(
|
||||||
|
editRepData.Category === repository.Category &&
|
||||||
|
editRepData.Description === repository.Description &&
|
||||||
|
editRepData.Name === repository.Name &&
|
||||||
|
editRepData.ShortDescription === repository.ShortDescription &&
|
||||||
|
editRepData.Version === repository.Version
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
const response = await RepositoryService.editRepository(repository.Id, editRepData)
|
||||||
|
if (response.status === 406) {
|
||||||
|
setError({ state: true, message: response.data })
|
||||||
|
setLoading(false)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (repository.Url !== selectedFile && selectedFile instanceof File) {
|
||||||
|
const response = await RepositoryService.addFile(selectedFile, repository.Id)
|
||||||
|
if (response.status === 406) {
|
||||||
|
setError({ state: true, message: response.data })
|
||||||
|
setLoading(false)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
}
|
||||||
|
setLoading(false)
|
||||||
|
setModal(false)
|
||||||
|
getRep()
|
||||||
|
} catch (error) {}
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
<>
|
||||||
<Modal modal={modal} setModal={setModal}>
|
<Modal modal={modal} setModal={setModal}>
|
||||||
<ModalContainer>
|
<ModalContainer>
|
||||||
|
|
||||||
|
<h2>Изменение пакета в репозитории</h2>
|
||||||
<MainInput
|
<MainInput
|
||||||
placeholder='Название'
|
placeholder='Название'
|
||||||
value={editRepData.Name}
|
value={editRepData.Name}
|
||||||
|
@ -72,7 +167,7 @@ export default function EditRepModal({
|
||||||
value={editRepData.Description}
|
value={editRepData.Description}
|
||||||
onChange={handleShortDescriptionChange}
|
onChange={handleShortDescriptionChange}
|
||||||
/>
|
/>
|
||||||
<MainInput
|
<Textarea
|
||||||
placeholder='Полное описание'
|
placeholder='Полное описание'
|
||||||
value={editRepData.Description}
|
value={editRepData.Description}
|
||||||
onChange={handleDescriptionChange}
|
onChange={handleDescriptionChange}
|
||||||
|
@ -82,19 +177,50 @@ export default function EditRepModal({
|
||||||
value={editRepData.Category}
|
value={editRepData.Category}
|
||||||
onChange={handleCategoryChange}
|
onChange={handleCategoryChange}
|
||||||
/>
|
/>
|
||||||
|
<div>
|
||||||
|
<NewRepFileBlock>
|
||||||
|
<input
|
||||||
|
ref={fileInputRef}
|
||||||
|
type='file'
|
||||||
|
accept='.deb'
|
||||||
|
onChange={handleFileChange}
|
||||||
|
/>
|
||||||
|
{selectedFile ? (
|
||||||
|
<p>
|
||||||
|
<span>Выбранный файл: </span>
|
||||||
|
{selectedFile.name}
|
||||||
|
</p>
|
||||||
|
) : (
|
||||||
|
<p>
|
||||||
|
<span>Файл не выбран</span>
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
|
<MainButton onClick={handleFileClick}>Выбрать файл</MainButton>
|
||||||
|
</NewRepFileBlock>
|
||||||
|
</div>
|
||||||
<div className='buttonBlock'>
|
<div className='buttonBlock'>
|
||||||
<MainButton
|
<MainButton
|
||||||
color='secondary'
|
color='secondary'
|
||||||
fullWidth={true}
|
fullWidth
|
||||||
onClick={() => setModal(false)}
|
onClick={() => setModal(false)}
|
||||||
>
|
>
|
||||||
Отмена
|
Отмена
|
||||||
</MainButton>
|
</MainButton>
|
||||||
<MainButton fullWidth={true} onClick={() => editRep(editRepData)}>
|
<MainButton fullWidth onClick={updateRep} disabled={!formValid}>
|
||||||
Сохранить
|
Сохранить
|
||||||
</MainButton>
|
</MainButton>
|
||||||
</div>
|
</div>
|
||||||
</ModalContainer>
|
</ModalContainer>
|
||||||
</Modal>
|
</Modal>
|
||||||
|
<NewRepErrorMessageContainer>
|
||||||
|
<Modal modal={error.state} setModal={setErrorState}>
|
||||||
|
<NewRepErrorMessage>
|
||||||
|
<h3>{error.message}</h3>
|
||||||
|
<MainButton onClick={() => setErrorState(false)}>Ok</MainButton>
|
||||||
|
</NewRepErrorMessage>
|
||||||
|
</Modal>
|
||||||
|
</NewRepErrorMessageContainer>
|
||||||
|
|
||||||
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,13 +1,39 @@
|
||||||
import { useEffect, useRef, ChangeEvent, useState } from 'react'
|
import { useEffect, useRef, useState } from 'react'
|
||||||
import MainButton from 'src/components/UI/button/MainButton'
|
import MainButton from 'src/components/UI/button/MainButton'
|
||||||
import MainInput from 'src/components/UI/input/MainInput'
|
import MainInput from 'src/components/UI/input/MainInput'
|
||||||
import Modal from 'src/components/UI/modal/Modal'
|
import Modal from 'src/components/UI/modal/Modal'
|
||||||
|
import Textarea from 'src/components/UI/input/Textarea'
|
||||||
import RepositoryService from 'src/services/repositoryServices'
|
import RepositoryService from 'src/services/repositoryServices'
|
||||||
import styled from 'styled-components'
|
import styled from 'styled-components'
|
||||||
import { T_NewRepository } from '../types'
|
import { T_NewRepository } from '../types'
|
||||||
|
|
||||||
|
const NewRepErrorMessageContainer = styled.div`
|
||||||
|
position: relative;
|
||||||
|
z-index: 4;
|
||||||
|
`
|
||||||
|
|
||||||
|
const NewRepErrorMessage = styled.div`
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: end;
|
||||||
|
gap: 20px;
|
||||||
|
`
|
||||||
|
const NewAppFileBlock = styled.div`
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
input {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
const ModalContainer = styled.div`
|
const ModalContainer = styled.div`
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -21,66 +47,52 @@ const ModalContainer = styled.div`
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
|
|
||||||
const ErrorMessageContainer = styled.div`
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: end;
|
|
||||||
gap: 20px;
|
|
||||||
`
|
|
||||||
|
|
||||||
const Test = styled.div`
|
|
||||||
z-index: 3;
|
|
||||||
`
|
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
modal: boolean
|
modal: boolean
|
||||||
setModal: (param: boolean) => void
|
setModal: (param: boolean) => void
|
||||||
newRep: T_NewRepository
|
|
||||||
setNewRep: (param: T_NewRepository) => void
|
|
||||||
getRep: () => void
|
getRep: () => void
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function NewRepModal({
|
export default function NewRepModal({ modal, setModal, getRep }: Props) {
|
||||||
modal,
|
const [newRep, setNewRep] = useState<T_NewRepository>({
|
||||||
setModal,
|
Name: '',
|
||||||
newRep,
|
Description: '',
|
||||||
setNewRep,
|
ShortDescription: '',
|
||||||
getRep
|
Version: '',
|
||||||
}: Props) {
|
Category: ''
|
||||||
const [errorMessage, setErrorMessage] = useState(false)
|
})
|
||||||
|
const [selectedFile, setSelectedFile] = useState<File | null>(null)
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
setNewRep({
|
||||||
|
Name: '',
|
||||||
|
Description: '',
|
||||||
|
ShortDescription: '',
|
||||||
|
Version: '',
|
||||||
|
Category: ''
|
||||||
|
})
|
||||||
|
setSelectedFile(null)
|
||||||
|
}, [modal])
|
||||||
|
|
||||||
const CreateRep = async () => {
|
const [formValid, setFormValid] = useState(false)
|
||||||
const response = await RepositoryService.createRepository(newRep)
|
|
||||||
if (response.status === 406) {
|
|
||||||
setNewRep({ ...newRep})
|
|
||||||
setErrorMessage(true)
|
|
||||||
} else {
|
|
||||||
setModal(false)
|
|
||||||
getRep()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
const fileInputRef = useRef<HTMLInputElement>(null);
|
|
||||||
const [selectedFile, setSelectedFile] = useState<File | null>(null);
|
|
||||||
|
|
||||||
const handleFileChange = (event: ChangeEvent<HTMLInputElement>) => {
|
useEffect(() => {
|
||||||
const files = event.target.files;
|
setFormValid(
|
||||||
if (files && files.length > 0) {
|
newRep.Name !== '' &&
|
||||||
const file = files[0];
|
newRep.Description !== '' &&
|
||||||
setSelectedFile(file);
|
newRep.ShortDescription !== '' &&
|
||||||
}
|
newRep.Version !== '' &&
|
||||||
};
|
newRep.Category !== ''
|
||||||
|
)
|
||||||
|
}, [newRep])
|
||||||
|
|
||||||
|
const [errorState, setErrorState] = useState(false)
|
||||||
|
|
||||||
const handleButtonClick = () => {
|
|
||||||
if (fileInputRef.current) {
|
|
||||||
fileInputRef.current.click();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
setNewRep({ ...newRep, Name: e.target.value })
|
setNewRep({ ...newRep, Name: e.target.value })
|
||||||
}
|
}
|
||||||
const handleDescriptionChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
const handleDescriptionChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
|
||||||
setNewRep({ ...newRep, Description: e.target.value })
|
setNewRep({ ...newRep, Description: e.target.value })
|
||||||
}
|
}
|
||||||
const handleShortDescriptionChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
const handleShortDescriptionChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
|
@ -92,10 +104,40 @@ export default function NewRepModal({
|
||||||
const handleCategoryChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
const handleCategoryChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
setNewRep({ ...newRep, Category: e.target.value })
|
setNewRep({ ...newRep, Category: e.target.value })
|
||||||
}
|
}
|
||||||
|
const fileInputRef = useRef<HTMLInputElement>(null)
|
||||||
|
|
||||||
|
const handleFileChange = () => {
|
||||||
|
const file = fileInputRef.current?.files?.[0]
|
||||||
|
if (file) {
|
||||||
|
setSelectedFile(file)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleFileClick = () => {
|
||||||
|
fileInputRef.current?.click()
|
||||||
|
}
|
||||||
|
|
||||||
|
const repCreate = async () => {
|
||||||
|
try {
|
||||||
|
const response = await RepositoryService.createRep(newRep)
|
||||||
|
if (response.status === 200) {
|
||||||
|
|
||||||
|
selectedFile !== null &&
|
||||||
|
(await RepositoryService.addFile(selectedFile, response.data.Id))
|
||||||
|
} else if (response.status === 406) {
|
||||||
|
setErrorState(true)
|
||||||
|
}
|
||||||
|
setModal(false)
|
||||||
|
getRep()
|
||||||
|
} catch (error) {
|
||||||
|
console.log(error)
|
||||||
|
}
|
||||||
|
}
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Modal modal={modal} setModal={setModal}>
|
<Modal modal={modal} setModal={setModal}>
|
||||||
<ModalContainer>
|
<ModalContainer>
|
||||||
|
<h2>Внесение пакета в репозиторий</h2>
|
||||||
<MainInput
|
<MainInput
|
||||||
placeholder='Название'
|
placeholder='Название'
|
||||||
value={newRep.Name}
|
value={newRep.Name}
|
||||||
|
@ -111,7 +153,7 @@ export default function NewRepModal({
|
||||||
value={newRep.ShortDescription}
|
value={newRep.ShortDescription}
|
||||||
onChange={handleShortDescriptionChange}
|
onChange={handleShortDescriptionChange}
|
||||||
/>
|
/>
|
||||||
<MainInput
|
<Textarea
|
||||||
placeholder='Полное описание'
|
placeholder='Полное описание'
|
||||||
value={newRep.Description}
|
value={newRep.Description}
|
||||||
onChange={handleDescriptionChange}
|
onChange={handleDescriptionChange}
|
||||||
|
@ -121,49 +163,49 @@ export default function NewRepModal({
|
||||||
value={newRep.Category}
|
value={newRep.Category}
|
||||||
onChange={handleCategoryChange}
|
onChange={handleCategoryChange}
|
||||||
/>
|
/>
|
||||||
<div>
|
<div>
|
||||||
<div className='fileBlock'>
|
<NewAppFileBlock>
|
||||||
<span>
|
<input
|
||||||
Имя файла:
|
ref={fileInputRef}
|
||||||
</span>
|
type='file'
|
||||||
<input
|
accept='.deb'
|
||||||
type="file"
|
onChange={handleFileChange}
|
||||||
ref={fileInputRef}
|
/>
|
||||||
onChange={handleFileChange}
|
{selectedFile ? (
|
||||||
style={{ display: 'none' }}
|
<p>
|
||||||
/>
|
<span>Выбранный файл: </span>
|
||||||
<input
|
{selectedFile.name}
|
||||||
type="text"
|
</p>
|
||||||
value={selectedFile ? selectedFile.name : ''}
|
) : (
|
||||||
readOnly
|
<p>
|
||||||
style={{border: 'none'}}
|
<span>Файл не выбран</span>
|
||||||
/>
|
</p>
|
||||||
<MainButton onClick={handleButtonClick}>Выбрать файл</MainButton>
|
)}
|
||||||
|
<MainButton onClick={handleFileClick}>Выбрать файл</MainButton>
|
||||||
</div>
|
</NewAppFileBlock>
|
||||||
</div>
|
</div>
|
||||||
<div className='buttonBlock'>
|
<div className='buttonBlock'>
|
||||||
<MainButton
|
<MainButton
|
||||||
color='secondary'
|
color='secondary'
|
||||||
fullWidth={true}
|
fullWidth
|
||||||
onClick={() => setModal(false)}
|
onClick={() => setModal(false)}
|
||||||
>
|
>
|
||||||
Отмена
|
Отмена
|
||||||
</MainButton>
|
</MainButton>
|
||||||
<MainButton fullWidth={true} onClick={CreateRep}>
|
<MainButton fullWidth onClick={repCreate} disabled={!formValid}>
|
||||||
Создать
|
Создать
|
||||||
</MainButton>
|
</MainButton>
|
||||||
</div>
|
</div>
|
||||||
</ModalContainer>
|
</ModalContainer>
|
||||||
</Modal>
|
</Modal>
|
||||||
<Test>
|
<NewRepErrorMessageContainer>
|
||||||
<Modal modal={errorMessage} setModal={setErrorMessage}>
|
<Modal modal={errorState} setModal={setErrorState}>
|
||||||
<ErrorMessageContainer>
|
<NewRepErrorMessage>
|
||||||
<h3>Пакет уже существует</h3>
|
<h3>Имя и версия уже существует</h3>
|
||||||
<MainButton onClick={() => setErrorMessage(false)}>Ok</MainButton>
|
<MainButton onClick={() => setErrorState(false)}>Ok</MainButton>
|
||||||
</ErrorMessageContainer>
|
</NewRepErrorMessage>
|
||||||
</Modal>
|
</Modal>
|
||||||
</Test>
|
</NewRepErrorMessageContainer>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -7,14 +7,13 @@ import Checkbox from 'src/components/UI/input/Checkbox'
|
||||||
import Modal from 'src/components/UI/modal/Modal'
|
import Modal from 'src/components/UI/modal/Modal'
|
||||||
import RepositoryService from 'src/services/repositoryServices'
|
import RepositoryService from 'src/services/repositoryServices'
|
||||||
import styled from 'styled-components'
|
import styled from 'styled-components'
|
||||||
import { T_ColumnsState, T_NewRepository, T_RepositoryItem } from '../types'
|
import { T_ColumnsState, T_RepositoryItem } from '../types'
|
||||||
import EditRepModal from './EditRepModal'
|
import EditRepModal from './EditRepModal'
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
repository: T_RepositoryItem
|
repository: T_RepositoryItem
|
||||||
selectAll: boolean
|
selectAll: boolean
|
||||||
notChecked: number[]
|
notChecked: number[]
|
||||||
|
|
||||||
checkedColumns: number[]
|
checkedColumns: number[]
|
||||||
setNotChecked: (param: any) => void
|
setNotChecked: (param: any) => void
|
||||||
setCheckedColumns: (param: any) => void
|
setCheckedColumns: (param: any) => void
|
||||||
|
@ -102,17 +101,7 @@ export default function ({
|
||||||
getRep()
|
getRep()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const editRep = async (rep: T_NewRepository) => {
|
|
||||||
setContextMenuState(false)
|
|
||||||
const response = await RepositoryService.editRepository(
|
|
||||||
repository.Id,
|
|
||||||
rep
|
|
||||||
)
|
|
||||||
if (response.status === 200) {
|
|
||||||
getRep()
|
|
||||||
}
|
|
||||||
setEditModalState(false)
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
@ -194,10 +183,21 @@ export default function ({
|
||||||
<img src='/src/images/trash.svg' alt='' />
|
<img src='/src/images/trash.svg' alt='' />
|
||||||
<p>Очистить зависимости</p>
|
<p>Очистить зависимости</p>
|
||||||
</Item>
|
</Item>
|
||||||
|
{repository.Url !== '' && (
|
||||||
|
<Link
|
||||||
|
to={`${HOST_NAME}/${repository.Url}`}
|
||||||
|
onClick={() => setContextMenuState(false)}
|
||||||
|
>
|
||||||
<Item onClick={dowRep}>
|
<Item onClick={dowRep}>
|
||||||
<img src='/src/images/download_2.svg' alt='' />
|
<img
|
||||||
<p>Скачать пакет</p>
|
src='/src/images/download.svg'
|
||||||
|
alt=''
|
||||||
|
style={{ width: '20px' }}
|
||||||
|
/>
|
||||||
|
<p>Скачать</p>
|
||||||
</Item>
|
</Item>
|
||||||
|
</Link>
|
||||||
|
)}
|
||||||
<Item onClick={() => (setEditModalState(true), setContextMenuState(false))}>
|
<Item onClick={() => (setEditModalState(true), setContextMenuState(false))}>
|
||||||
<img src='/src/images/edit.svg' alt='' />
|
<img src='/src/images/edit.svg' alt='' />
|
||||||
<p>Редактировать</p>
|
<p>Редактировать</p>
|
||||||
|
@ -222,12 +222,12 @@ export default function ({
|
||||||
<div className='button-container'>
|
<div className='button-container'>
|
||||||
<MainButton
|
<MainButton
|
||||||
color={'secondary'}
|
color={'secondary'}
|
||||||
fullWidth={true}
|
fullWidth
|
||||||
onClick={() => setDeleteNotificationState(false)}
|
onClick={() => setDeleteNotificationState(false)}
|
||||||
>
|
>
|
||||||
Отмена
|
Отмена
|
||||||
</MainButton>
|
</MainButton>
|
||||||
<MainButton fullWidth={true} onClick={() => deleteRep()}>
|
<MainButton fullWidth onClick={() => deleteRep()}>
|
||||||
Удалить
|
Удалить
|
||||||
</MainButton>
|
</MainButton>
|
||||||
</div>
|
</div>
|
||||||
|
@ -237,7 +237,7 @@ export default function ({
|
||||||
modal={editModalState}
|
modal={editModalState}
|
||||||
setModal={setEditModalState}
|
setModal={setEditModalState}
|
||||||
repository={repository}
|
repository={repository}
|
||||||
editRep={editRep}
|
getRep={getRep}
|
||||||
/>
|
/>
|
||||||
</tr>
|
</tr>
|
||||||
</>
|
</>
|
||||||
|
|
|
@ -8,12 +8,16 @@ export type T_NewRepository = {
|
||||||
|
|
||||||
export interface T_RepositoryItem {
|
export interface T_RepositoryItem {
|
||||||
Id: number;
|
Id: number;
|
||||||
Name: string
|
Name: string;
|
||||||
Description: string
|
Description: string;
|
||||||
ShortDescription: string
|
ShortDescription: string;
|
||||||
Version: string
|
Version: string;
|
||||||
Category: string
|
DependenciesReceived: boolean;
|
||||||
UpdatedDate: string
|
Arch: "amd64" | "x86" | string;
|
||||||
|
Category: string;
|
||||||
|
CreatedDate: string;
|
||||||
|
UpdatedDate: string;
|
||||||
|
Url: string|null;
|
||||||
Enabled: boolean;
|
Enabled: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
import axios, { AxiosResponse } from 'axios'
|
import axios, { AxiosResponse } from 'axios'
|
||||||
import { API_HOST_NAME } from 'src/constants/host'
|
import { API_HOST_NAME } from 'src/constants/host'
|
||||||
import { T_NewRepository } from 'src/pages/Repository/types'
|
import { T_NewRepository } from 'src/pages/Repository/types'
|
||||||
|
|
||||||
import { I_QueryParams } from './type'
|
import { I_QueryParams } from './type'
|
||||||
|
|
||||||
export default class RepositoryService {
|
export default class RepositoryService {
|
||||||
|
@ -9,7 +8,7 @@ export default class RepositoryService {
|
||||||
queryParams: I_QueryParams
|
queryParams: I_QueryParams
|
||||||
): Promise<AxiosResponse> {
|
): Promise<AxiosResponse> {
|
||||||
const { page, count, search, order } = queryParams
|
const { page, count, search, order } = queryParams
|
||||||
const url = `${API_HOST_NAME}/repository/packages`
|
const url = `${API_HOST_NAME}/repository/packages?full=true`
|
||||||
const params = new URLSearchParams()
|
const params = new URLSearchParams()
|
||||||
|
|
||||||
if (page !== undefined) params.append('page', String(page))
|
if (page !== undefined) params.append('page', String(page))
|
||||||
|
@ -26,7 +25,7 @@ export default class RepositoryService {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
static async createRepository(
|
static async createRep(
|
||||||
newRep: T_NewRepository
|
newRep: T_NewRepository
|
||||||
): Promise<AxiosResponse> {
|
): Promise<AxiosResponse> {
|
||||||
try {
|
try {
|
||||||
|
|
Loading…
Reference in New Issue