implement item detail base class DetailBase.
This commit is contained in:
@@ -1,46 +1,34 @@
|
||||
import React, { ReactNode } from 'react';
|
||||
import ItemTypeField from '../lib/field';
|
||||
import React from 'react';
|
||||
import { ItemBook } from '../../lib/ItemUtil';
|
||||
import DetailBase, { DetailBaseProps } from '../lib/DetailBase';
|
||||
import ItemTypeField from '../lib/field';
|
||||
|
||||
const BookDetail = (props: { item: ItemBook }) => {
|
||||
const { item } = props;
|
||||
const fields: { label: ReactNode, value: ReactNode }[] = [
|
||||
{ label: 'ID', value: item.doi },
|
||||
{ label: 'Language', value: <ItemTypeField.Language lang={item.lang} /> },
|
||||
{ label: 'Title', value: item.title },
|
||||
{ label: 'Free Keywords', value: <ItemTypeField.FreeKeyword keyword={item.keyword} /> },
|
||||
{ label: 'Description', value: <ItemTypeField.Description description={item.description} /> },
|
||||
{ label: 'Last Modified Date', value: <ItemTypeField.DateTime date={item.last_update_date} /> },
|
||||
{ label: 'Created Date', value: <ItemTypeField.DateTime date={item.creation_date} /> },
|
||||
{ label: 'Contributor', value: <ItemTypeField.Contributer uname={item.uname} name={item.name} /> },
|
||||
{ label: 'Item Type', value: item.item_type_display_name },
|
||||
{ label: 'Change Log(History)', value: <ItemTypeField.ChangeLog changelog={item.changelog} /> },
|
||||
{ label: 'Author', value: <ItemTypeField.Author author={item.author} /> },
|
||||
{ label: 'Editor', value: item.editor },
|
||||
{ label: 'Publisher', value: item.publisher },
|
||||
{ label: 'Publication Year', value: item.publication_year },
|
||||
{ label: 'URL', value: <a href={item.url} target="_blank" rel="noopener noreferrer">{item.url}</a> },
|
||||
{ label: 'PDF File', value: <ItemTypeField.ItemFile file={item.file} type="book_pdf" /> },
|
||||
{ label: 'Index', value: <ItemTypeField.ItemIndex index={item.index} /> },
|
||||
{ label: 'Related to', value: <ItemTypeField.RelatedTo relatedTo={item.related_to} /> },
|
||||
];
|
||||
let evenodd = 'even';
|
||||
const elements = fields.map((value, i) => {
|
||||
evenodd = evenodd === 'even' ? 'odd' : 'even'
|
||||
return (
|
||||
<tr key={i}>
|
||||
<td className="head">{value.label}</td>
|
||||
<td className={evenodd}>{value.value}</td>
|
||||
</tr>
|
||||
)
|
||||
});
|
||||
return (
|
||||
<table className="outer itemDetail">
|
||||
<tbody>
|
||||
{elements}
|
||||
</tbody>
|
||||
</table>
|
||||
);
|
||||
};
|
||||
class BookDetail extends DetailBase {
|
||||
|
||||
constructor(props: DetailBaseProps) {
|
||||
super(props);
|
||||
const item = this.item as ItemBook;
|
||||
this.fields = [
|
||||
{ label: 'ID', value: item.doi },
|
||||
{ label: 'Language', value: <ItemTypeField.Language lang={item.lang} /> },
|
||||
{ label: 'Title', value: item.title },
|
||||
{ label: 'Free Keywords', value: <ItemTypeField.FreeKeyword keyword={item.keyword} /> },
|
||||
{ label: 'Description', value: <ItemTypeField.Description description={item.description} /> },
|
||||
{ label: 'Last Modified Date', value: <ItemTypeField.DateTime date={item.last_update_date} /> },
|
||||
{ label: 'Created Date', value: <ItemTypeField.DateTime date={item.creation_date} /> },
|
||||
{ label: 'Contributor', value: <ItemTypeField.Contributer uname={item.uname} name={item.name} /> },
|
||||
{ label: 'Item Type', value: item.item_type_display_name },
|
||||
{ label: 'Change Log(History)', value: <ItemTypeField.ChangeLog changelog={item.changelog} /> },
|
||||
{ label: 'Author', value: <ItemTypeField.Author author={item.author} /> },
|
||||
{ label: 'Editor', value: item.editor },
|
||||
{ label: 'Publisher', value: item.publisher },
|
||||
{ label: 'Publication Year', value: item.publication_year },
|
||||
{ label: 'URL', value: <a href={item.url} target="_blank" rel="noopener noreferrer">{item.url}</a> },
|
||||
{ label: 'PDF File', value: <ItemTypeField.ItemFile file={item.file} type="book_pdf" /> },
|
||||
{ label: 'Index', value: <ItemTypeField.ItemIndex index={item.index} /> },
|
||||
{ label: 'Related to', value: <ItemTypeField.RelatedTo relatedTo={item.related_to} /> },
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
export default BookDetail;
|
||||
|
||||
@@ -1,47 +1,35 @@
|
||||
import React, { ReactNode } from 'react';
|
||||
import ItemTypeField from '../lib/field';
|
||||
import React from 'react';
|
||||
import { ItemConference } from '../../lib/ItemUtil';
|
||||
import DetailBase, { DetailBaseProps } from '../lib/DetailBase';
|
||||
import ItemTypeField from '../lib/field';
|
||||
import ConferenceUtil from './ConferenceUtil';
|
||||
|
||||
const ConferenceDetail = (props: { item: ItemConference }) => {
|
||||
const { item } = props;
|
||||
const fields: { label: ReactNode, value: ReactNode }[] = [
|
||||
{ label: 'ID', value: item.doi },
|
||||
{ label: 'Language', value: <ItemTypeField.Language lang={item.lang} /> },
|
||||
{ label: 'Conference Title', value: item.conference_title },
|
||||
{ label: 'Place', value: item.place },
|
||||
{ label: 'Date', value: <ConferenceUtil.ConferenceDate item={item} /> },
|
||||
{ label: 'Last Modified Date', value: <ItemTypeField.DateTime date={item.last_update_date} /> },
|
||||
{ label: 'Created Date', value: <ItemTypeField.DateTime date={item.creation_date} /> },
|
||||
{ label: 'Contributor', value: <ItemTypeField.Contributer uname={item.uname} name={item.name} /> },
|
||||
{ label: 'Item Type', value: item.item_type_display_name },
|
||||
{ label: 'Change Log(History)', value: <ItemTypeField.ChangeLog changelog={item.changelog} /> },
|
||||
{ label: 'Presentation Title', value: item.title },
|
||||
{ label: 'Author', value: <ItemTypeField.Author author={item.author} /> },
|
||||
{ label: 'Abstract', value: <ItemTypeField.Description description={item.abstract} /> },
|
||||
{ label: 'Presentation File', value: <ItemTypeField.ItemFile file={item.file} type="conference_file" /> },
|
||||
{ label: 'Presentation Type', value: <ConferenceUtil.PresentationType type={item.presentation_type} /> },
|
||||
{ label: 'Conference Paper', value: <ItemTypeField.ItemFile file={item.file} type="conference_paper" /> },
|
||||
{ label: 'Index', value: <ItemTypeField.ItemIndex index={item.index} /> },
|
||||
{ label: 'Related to', value: <ItemTypeField.RelatedTo relatedTo={item.related_to} /> },
|
||||
];
|
||||
let evenodd = 'even';
|
||||
const elements = fields.map((value, i) => {
|
||||
evenodd = evenodd === 'even' ? 'odd' : 'even'
|
||||
return (
|
||||
<tr key={i}>
|
||||
<td className="head">{value.label}</td>
|
||||
<td className={evenodd}>{value.value}</td>
|
||||
</tr>
|
||||
)
|
||||
});
|
||||
return (
|
||||
<table className="outer itemDetail">
|
||||
<tbody>
|
||||
{elements}
|
||||
</tbody>
|
||||
</table>
|
||||
);
|
||||
};
|
||||
class ConferenceDetail extends DetailBase {
|
||||
|
||||
constructor(props: DetailBaseProps) {
|
||||
super(props);
|
||||
const item = this.item as ItemConference;
|
||||
this.fields = [
|
||||
{ label: 'ID', value: item.doi },
|
||||
{ label: 'Language', value: <ItemTypeField.Language lang={item.lang} /> },
|
||||
{ label: 'Conference Title', value: item.conference_title },
|
||||
{ label: 'Place', value: item.place },
|
||||
{ label: 'Date', value: <ConferenceUtil.ConferenceDate item={item} /> },
|
||||
{ label: 'Last Modified Date', value: <ItemTypeField.DateTime date={item.last_update_date} /> },
|
||||
{ label: 'Created Date', value: <ItemTypeField.DateTime date={item.creation_date} /> },
|
||||
{ label: 'Contributor', value: <ItemTypeField.Contributer uname={item.uname} name={item.name} /> },
|
||||
{ label: 'Item Type', value: item.item_type_display_name },
|
||||
{ label: 'Change Log(History)', value: <ItemTypeField.ChangeLog changelog={item.changelog} /> },
|
||||
{ label: 'Presentation Title', value: item.title },
|
||||
{ label: 'Author', value: <ItemTypeField.Author author={item.author} /> },
|
||||
{ label: 'Abstract', value: <ItemTypeField.Description description={item.abstract} /> },
|
||||
{ label: 'Presentation File', value: <ItemTypeField.ItemFile file={item.file} type="conference_file" /> },
|
||||
{ label: 'Presentation Type', value: <ConferenceUtil.PresentationType type={item.presentation_type} /> },
|
||||
{ label: 'Conference Paper', value: <ItemTypeField.ItemFile file={item.file} type="conference_paper" /> },
|
||||
{ label: 'Index', value: <ItemTypeField.ItemIndex index={item.index} /> },
|
||||
{ label: 'Related to', value: <ItemTypeField.RelatedTo relatedTo={item.related_to} /> },
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
export default ConferenceDetail;
|
||||
@@ -1,48 +1,36 @@
|
||||
import React, { ReactNode } from 'react';
|
||||
import ItemTypeField from '../lib/field';
|
||||
import React from 'react';
|
||||
import { ItemData } from '../../lib/ItemUtil';
|
||||
import DetailBase, { DetailBaseProps } from '../lib/DetailBase';
|
||||
import ItemTypeField from '../lib/field';
|
||||
import DataUtil from './DataUtil';
|
||||
|
||||
const DataDetail = (props: { item: ItemData }) => {
|
||||
const { item } = props;
|
||||
const fields: { label: ReactNode, value: ReactNode }[] = [
|
||||
{ label: 'ID', value: item.doi },
|
||||
{ label: 'Language', value: <ItemTypeField.Language lang={item.lang} /> },
|
||||
{ label: 'Title', value: item.title },
|
||||
{ label: 'Free Keywords', value: <ItemTypeField.FreeKeyword keyword={item.keyword} /> },
|
||||
{ label: 'Description', value: <ItemTypeField.Description description={item.description} /> },
|
||||
{ label: 'Date', value: <ItemTypeField.PublicationDate year={item.publication_year} month={item.publication_month} mday={item.publication_mday} /> },
|
||||
{ label: 'Last Modified Date', value: <ItemTypeField.DateTime date={item.last_update_date} /> },
|
||||
{ label: 'Created Date', value: <ItemTypeField.DateTime date={item.creation_date} /> },
|
||||
{ label: 'Contributor', value: <ItemTypeField.Contributer uname={item.uname} name={item.name} /> },
|
||||
{ label: 'Item Type', value: item.item_type_display_name },
|
||||
{ label: 'Change Log(History)', value: <ItemTypeField.ChangeLog changelog={item.changelog} /> },
|
||||
{ label: 'Data Type', value: <DataUtil.DataType type={item.data_type} /> },
|
||||
{ label: 'Experimenter', value: <ItemTypeField.Author author={item.experimenter} /> },
|
||||
{ label: 'Preview', value: <ItemTypeField.Preview file={item.file} /> },
|
||||
{ label: 'Data File', value: <ItemTypeField.ItemFile file={item.file} type="data_file" rights={item.rights} useCc={item.use_cc} ccCommercialUse={item.cc_commercial_use} ccModification={item.cc_modification} /> },
|
||||
{ label: 'Readme', value: <ItemTypeField.Readme readme={item.readme} /> },
|
||||
{ label: 'Rights', value: <ItemTypeField.Rights rights={item.rights} useCc={item.use_cc} ccCommercialUse={item.cc_commercial_use} ccModification={item.cc_modification} /> },
|
||||
{ label: 'Index', value: <ItemTypeField.ItemIndex index={item.index} /> },
|
||||
{ label: 'Related to', value: <ItemTypeField.RelatedTo relatedTo={item.related_to} /> },
|
||||
];
|
||||
let evenodd = 'even';
|
||||
const elements = fields.map((value, i) => {
|
||||
evenodd = evenodd === 'even' ? 'odd' : 'even'
|
||||
return (
|
||||
<tr key={i}>
|
||||
<td className="head">{value.label}</td>
|
||||
<td className={evenodd}>{value.value}</td>
|
||||
</tr>
|
||||
)
|
||||
});
|
||||
return (
|
||||
<table className="outer itemDetail">
|
||||
<tbody>
|
||||
{elements}
|
||||
</tbody>
|
||||
</table>
|
||||
);
|
||||
};
|
||||
class DataDetail extends DetailBase {
|
||||
|
||||
constructor(props: DetailBaseProps) {
|
||||
super(props);
|
||||
const item = this.item as ItemData;
|
||||
this.fields = [
|
||||
{ label: 'ID', value: item.doi },
|
||||
{ label: 'Language', value: <ItemTypeField.Language lang={item.lang} /> },
|
||||
{ label: 'Title', value: item.title },
|
||||
{ label: 'Free Keywords', value: <ItemTypeField.FreeKeyword keyword={item.keyword} /> },
|
||||
{ label: 'Description', value: <ItemTypeField.Description description={item.description} /> },
|
||||
{ label: 'Date', value: <ItemTypeField.PublicationDate year={item.publication_year} month={item.publication_month} mday={item.publication_mday} /> },
|
||||
{ label: 'Last Modified Date', value: <ItemTypeField.DateTime date={item.last_update_date} /> },
|
||||
{ label: 'Created Date', value: <ItemTypeField.DateTime date={item.creation_date} /> },
|
||||
{ label: 'Contributor', value: <ItemTypeField.Contributer uname={item.uname} name={item.name} /> },
|
||||
{ label: 'Item Type', value: item.item_type_display_name },
|
||||
{ label: 'Change Log(History)', value: <ItemTypeField.ChangeLog changelog={item.changelog} /> },
|
||||
{ label: 'Data Type', value: <DataUtil.DataType type={item.data_type} /> },
|
||||
{ label: 'Experimenter', value: <ItemTypeField.Author author={item.experimenter} /> },
|
||||
{ label: 'Preview', value: <ItemTypeField.Preview file={item.file} /> },
|
||||
{ label: 'Data File', value: <ItemTypeField.ItemFile file={item.file} type="data_file" rights={item.rights} useCc={item.use_cc} ccCommercialUse={item.cc_commercial_use} ccModification={item.cc_modification} /> },
|
||||
{ label: 'Readme', value: <ItemTypeField.Readme readme={item.readme} /> },
|
||||
{ label: 'Rights', value: <ItemTypeField.Rights rights={item.rights} useCc={item.use_cc} ccCommercialUse={item.cc_commercial_use} ccModification={item.cc_modification} /> },
|
||||
{ label: 'Index', value: <ItemTypeField.ItemIndex index={item.index} /> },
|
||||
{ label: 'Related to', value: <ItemTypeField.RelatedTo relatedTo={item.related_to} /> },
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
export default DataDetail;
|
||||
@@ -0,0 +1,40 @@
|
||||
import React, { ReactNode, Component } from 'react';
|
||||
import ItemUtil, { Item } from '../../lib/ItemUtil';
|
||||
|
||||
export interface DetailBaseProps { item: Item }
|
||||
export interface DetailBaseField { label: ReactNode, value: ReactNode }
|
||||
|
||||
class DetailBase extends Component<DetailBaseProps> {
|
||||
|
||||
protected item: Item;
|
||||
protected fields: DetailBaseField[] = [];
|
||||
protected url: string;
|
||||
|
||||
constructor(props: DetailBaseProps) {
|
||||
super(props);
|
||||
this.item = props.item;
|
||||
this.url = ItemUtil.getUrl(this.item);
|
||||
}
|
||||
|
||||
render() {
|
||||
let evenodd = 'even';
|
||||
const elements = this.fields.map((value, i) => {
|
||||
evenodd = evenodd === 'even' ? 'odd' : 'even'
|
||||
return (
|
||||
<tr key={i}>
|
||||
<td className="head">{value.label}</td>
|
||||
<td className={evenodd}>{value.value}</td>
|
||||
</tr>
|
||||
)
|
||||
});
|
||||
return (
|
||||
<table className="outer itemDetail">
|
||||
<tbody>
|
||||
{elements}
|
||||
</tbody>
|
||||
</table>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default DetailBase;
|
||||
@@ -8,7 +8,7 @@ class ListBase extends Component<ListBaseProps> {
|
||||
protected item: Item;
|
||||
protected label = '';
|
||||
protected icon = '';
|
||||
protected url = '';
|
||||
protected url: string;
|
||||
|
||||
constructor(props: ListBaseProps) {
|
||||
super(props);
|
||||
|
||||
@@ -1,47 +1,35 @@
|
||||
import React, { ReactNode } from 'react';
|
||||
import ItemTypeField from '../lib/field';
|
||||
import React from 'react';
|
||||
import { ItemModel } from '../../lib/ItemUtil';
|
||||
import DetailBase, { DetailBaseProps } from '../lib/DetailBase';
|
||||
import ItemTypeField from '../lib/field';
|
||||
import ModelUtil from './ModelUtil';
|
||||
|
||||
const ModelDetail = (props: { item: ItemModel }) => {
|
||||
const { item } = props;
|
||||
const fields: { label: ReactNode, value: ReactNode }[] = [
|
||||
{ label: 'ID', value: item.doi },
|
||||
{ label: 'Language', value: <ItemTypeField.Language lang={item.lang} /> },
|
||||
{ label: 'Title', value: item.title },
|
||||
{ label: 'Free Keywords', value: <ItemTypeField.FreeKeyword keyword={item.keyword} /> },
|
||||
{ label: 'Description', value: <ItemTypeField.Description description={item.description} /> },
|
||||
{ label: 'Last Modified Date', value: <ItemTypeField.DateTime date={item.last_update_date} /> },
|
||||
{ label: 'Created Date', value: <ItemTypeField.DateTime date={item.creation_date} /> },
|
||||
{ label: 'Contributor', value: <ItemTypeField.Contributer uname={item.uname} name={item.name} /> },
|
||||
{ label: 'Item Type', value: item.item_type_display_name },
|
||||
{ label: 'Change Log(History)', value: <ItemTypeField.ChangeLog changelog={item.changelog} /> },
|
||||
{ label: 'Model Type', value: <ModelUtil.ModelType type={item.model_type} /> },
|
||||
{ label: 'Creator', value: <ItemTypeField.Author author={item.creator} /> },
|
||||
{ label: 'Preview', value: <ItemTypeField.Preview file={item.file} /> },
|
||||
{ label: 'Model File', value: <ItemTypeField.ItemFile file={item.file} type="model_data" rights={item.rights} useCc={item.use_cc} ccCommercialUse={item.cc_commercial_use} ccModification={item.cc_modification} /> },
|
||||
{ label: 'Readme', value: <ItemTypeField.Readme readme={item.readme} /> },
|
||||
{ label: 'Rights', value: <ItemTypeField.Rights rights={item.rights} useCc={item.use_cc} ccCommercialUse={item.cc_commercial_use} ccModification={item.cc_modification} /> },
|
||||
{ label: 'Index', value: <ItemTypeField.ItemIndex index={item.index} /> },
|
||||
{ label: 'Related to', value: <ItemTypeField.RelatedTo relatedTo={item.related_to} /> },
|
||||
];
|
||||
let evenodd = 'even';
|
||||
const elements = fields.map((value, i) => {
|
||||
evenodd = evenodd === 'even' ? 'odd' : 'even'
|
||||
return (
|
||||
<tr key={i}>
|
||||
<td className="head">{value.label}</td>
|
||||
<td className={evenodd}>{value.value}</td>
|
||||
</tr>
|
||||
)
|
||||
});
|
||||
return (
|
||||
<table className="outer itemDetail">
|
||||
<tbody>
|
||||
{elements}
|
||||
</tbody>
|
||||
</table>
|
||||
);
|
||||
};
|
||||
class ModelDetail extends DetailBase {
|
||||
|
||||
constructor(props: DetailBaseProps) {
|
||||
super(props);
|
||||
const item = this.item as ItemModel;
|
||||
this.fields = [
|
||||
{ label: 'ID', value: item.doi },
|
||||
{ label: 'Language', value: <ItemTypeField.Language lang={item.lang} /> },
|
||||
{ label: 'Title', value: item.title },
|
||||
{ label: 'Free Keywords', value: <ItemTypeField.FreeKeyword keyword={item.keyword} /> },
|
||||
{ label: 'Description', value: <ItemTypeField.Description description={item.description} /> },
|
||||
{ label: 'Last Modified Date', value: <ItemTypeField.DateTime date={item.last_update_date} /> },
|
||||
{ label: 'Created Date', value: <ItemTypeField.DateTime date={item.creation_date} /> },
|
||||
{ label: 'Contributor', value: <ItemTypeField.Contributer uname={item.uname} name={item.name} /> },
|
||||
{ label: 'Item Type', value: item.item_type_display_name },
|
||||
{ label: 'Change Log(History)', value: <ItemTypeField.ChangeLog changelog={item.changelog} /> },
|
||||
{ label: 'Model Type', value: <ModelUtil.ModelType type={item.model_type} /> },
|
||||
{ label: 'Creator', value: <ItemTypeField.Author author={item.creator} /> },
|
||||
{ label: 'Preview', value: <ItemTypeField.Preview file={item.file} /> },
|
||||
{ label: 'Model File', value: <ItemTypeField.ItemFile file={item.file} type="model_data" rights={item.rights} useCc={item.use_cc} ccCommercialUse={item.cc_commercial_use} ccModification={item.cc_modification} /> },
|
||||
{ label: 'Readme', value: <ItemTypeField.Readme readme={item.readme} /> },
|
||||
{ label: 'Rights', value: <ItemTypeField.Rights rights={item.rights} useCc={item.use_cc} ccCommercialUse={item.cc_commercial_use} ccModification={item.cc_modification} /> },
|
||||
{ label: 'Index', value: <ItemTypeField.ItemIndex index={item.index} /> },
|
||||
{ label: 'Related to', value: <ItemTypeField.RelatedTo relatedTo={item.related_to} /> },
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
export default ModelDetail;
|
||||
@@ -1,48 +1,36 @@
|
||||
import React, { ReactNode } from 'react';
|
||||
import ItemTypeField from '../lib/field';
|
||||
import React from 'react';
|
||||
import { ItemPaper } from '../../lib/ItemUtil';
|
||||
import DetailBase, { DetailBaseProps } from '../lib/DetailBase';
|
||||
import ItemTypeField from '../lib/field';
|
||||
import PaperUtil from './PaperUtil';
|
||||
|
||||
const PaperDetail = (props: { item: ItemPaper }) => {
|
||||
const { item } = props;
|
||||
const fields: { label: ReactNode, value: ReactNode }[] = [
|
||||
{ label: 'ID', value: item.doi },
|
||||
{ label: 'Language', value: <ItemTypeField.Language lang={item.lang} /> },
|
||||
{ label: 'PubmedID', value: <PaperUtil.PubmedLink pubmedId={item.pubmed_id} /> },
|
||||
{ label: 'Title', value: item.title },
|
||||
{ label: 'Free Keywords', value: <ItemTypeField.FreeKeyword keyword={item.keyword} /> },
|
||||
{ label: 'Description', value: <ItemTypeField.Description description={item.description} /> },
|
||||
{ label: 'Last Modified Date', value: <ItemTypeField.DateTime date={item.last_update_date} /> },
|
||||
{ label: 'Created Date', value: <ItemTypeField.DateTime date={item.creation_date} /> },
|
||||
{ label: 'Contributor', value: <ItemTypeField.Contributer uname={item.uname} name={item.name} /> },
|
||||
{ label: 'Item Type', value: item.item_type_display_name },
|
||||
{ label: 'Change Log(History)', value: <ItemTypeField.ChangeLog changelog={item.changelog} /> },
|
||||
{ label: 'Author', value: <ItemTypeField.Author author={item.author} /> },
|
||||
{ label: 'Journal', value: item.journal },
|
||||
{ label: 'Publication Year', value: item.publication_year },
|
||||
{ label: 'Volume', value: item.volume },
|
||||
{ label: 'Number', value: item.number },
|
||||
{ label: 'Page', value: item.page },
|
||||
{ label: 'Index', value: <ItemTypeField.ItemIndex index={item.index} /> },
|
||||
{ label: 'Related to', value: <ItemTypeField.RelatedTo relatedTo={item.related_to} /> },
|
||||
];
|
||||
let evenodd = 'even';
|
||||
const elements = fields.map((value, i) => {
|
||||
evenodd = evenodd === 'even' ? 'odd' : 'even'
|
||||
return (
|
||||
<tr key={i}>
|
||||
<td className="head">{value.label}</td>
|
||||
<td className={evenodd}>{value.value}</td>
|
||||
</tr>
|
||||
)
|
||||
});
|
||||
return (
|
||||
<table className="outer itemDetail">
|
||||
<tbody>
|
||||
{elements}
|
||||
</tbody>
|
||||
</table>
|
||||
);
|
||||
};
|
||||
class PaperDetail extends DetailBase {
|
||||
|
||||
constructor(props: DetailBaseProps) {
|
||||
super(props);
|
||||
const item = this.item as ItemPaper;
|
||||
this.fields = [
|
||||
{ label: 'ID', value: item.doi },
|
||||
{ label: 'Language', value: <ItemTypeField.Language lang={item.lang} /> },
|
||||
{ label: 'PubmedID', value: <PaperUtil.PubmedLink pubmedId={item.pubmed_id} /> },
|
||||
{ label: 'Title', value: item.title },
|
||||
{ label: 'Free Keywords', value: <ItemTypeField.FreeKeyword keyword={item.keyword} /> },
|
||||
{ label: 'Description', value: <ItemTypeField.Description description={item.description} /> },
|
||||
{ label: 'Last Modified Date', value: <ItemTypeField.DateTime date={item.last_update_date} /> },
|
||||
{ label: 'Created Date', value: <ItemTypeField.DateTime date={item.creation_date} /> },
|
||||
{ label: 'Contributor', value: <ItemTypeField.Contributer uname={item.uname} name={item.name} /> },
|
||||
{ label: 'Item Type', value: item.item_type_display_name },
|
||||
{ label: 'Change Log(History)', value: <ItemTypeField.ChangeLog changelog={item.changelog} /> },
|
||||
{ label: 'Author', value: <ItemTypeField.Author author={item.author} /> },
|
||||
{ label: 'Journal', value: item.journal },
|
||||
{ label: 'Publication Year', value: item.publication_year },
|
||||
{ label: 'Volume', value: item.volume },
|
||||
{ label: 'Number', value: item.number },
|
||||
{ label: 'Page', value: item.page },
|
||||
{ label: 'Index', value: <ItemTypeField.ItemIndex index={item.index} /> },
|
||||
{ label: 'Related to', value: <ItemTypeField.RelatedTo relatedTo={item.related_to} /> },
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
export default PaperDetail;
|
||||
@@ -1,43 +1,31 @@
|
||||
import React, { ReactNode } from 'react';
|
||||
import ItemTypeField from '../lib/field';
|
||||
import React from 'react';
|
||||
import { ItemUrl } from '../../lib/ItemUtil';
|
||||
import DetailBase, { DetailBaseProps } from '../lib/DetailBase';
|
||||
import ItemTypeField from '../lib/field';
|
||||
import UrlUtil from './UrlUtil';
|
||||
|
||||
const UrlDetail = (props: { item: ItemUrl }) => {
|
||||
const { item } = props;
|
||||
const fields: { label: ReactNode, value: ReactNode }[] = [
|
||||
{ label: 'ID', value: item.doi },
|
||||
{ label: 'Language', value: <ItemTypeField.Language lang={item.lang} /> },
|
||||
{ label: 'Title', value: item.title },
|
||||
{ label: 'Free Keywords', value: <ItemTypeField.FreeKeyword keyword={item.keyword} /> },
|
||||
{ label: 'Description', value: <ItemTypeField.Description description={item.description} /> },
|
||||
{ label: 'Last Modified Date', value: <ItemTypeField.DateTime date={item.last_update_date} /> },
|
||||
{ label: 'Created Date', value: <ItemTypeField.DateTime date={item.creation_date} /> },
|
||||
{ label: 'Contributor', value: <ItemTypeField.Contributer uname={item.uname} name={item.name} /> },
|
||||
{ label: 'Item Type', value: item.item_type_display_name },
|
||||
{ label: 'Change Log(History)', value: <ItemTypeField.ChangeLog changelog={item.changelog} /> },
|
||||
{ label: 'URL', value: <a href={item.url} target="_blank" rel="noopener noreferrer">{item.url}</a> },
|
||||
{ label: 'Banner File', value: <UrlUtil.BannerFile file={item.file} /> },
|
||||
{ label: 'Index', value: <ItemTypeField.ItemIndex index={item.index} /> },
|
||||
{ label: 'Related to', value: <ItemTypeField.RelatedTo relatedTo={item.related_to} /> },
|
||||
];
|
||||
let evenodd = 'even';
|
||||
const elements = fields.map((value, i) => {
|
||||
evenodd = evenodd === 'even' ? 'odd' : 'even'
|
||||
return (
|
||||
<tr key={i}>
|
||||
<td className="head">{value.label}</td>
|
||||
<td className={evenodd}>{value.value}</td>
|
||||
</tr>
|
||||
)
|
||||
});
|
||||
return (
|
||||
<table className="outer itemDetail">
|
||||
<tbody>
|
||||
{elements}
|
||||
</tbody>
|
||||
</table>
|
||||
);
|
||||
};
|
||||
class UrlDetail extends DetailBase {
|
||||
|
||||
export default UrlDetail;
|
||||
constructor(props: DetailBaseProps) {
|
||||
super(props);
|
||||
const item = this.item as ItemUrl;
|
||||
this.fields = [
|
||||
{ label: 'ID', value: item.doi },
|
||||
{ label: 'Language', value: <ItemTypeField.Language lang={item.lang} /> },
|
||||
{ label: 'Title', value: item.title },
|
||||
{ label: 'Free Keywords', value: <ItemTypeField.FreeKeyword keyword={item.keyword} /> },
|
||||
{ label: 'Description', value: <ItemTypeField.Description description={item.description} /> },
|
||||
{ label: 'Last Modified Date', value: <ItemTypeField.DateTime date={item.last_update_date} /> },
|
||||
{ label: 'Created Date', value: <ItemTypeField.DateTime date={item.creation_date} /> },
|
||||
{ label: 'Contributor', value: <ItemTypeField.Contributer uname={item.uname} name={item.name} /> },
|
||||
{ label: 'Item Type', value: item.item_type_display_name },
|
||||
{ label: 'Change Log(History)', value: <ItemTypeField.ChangeLog changelog={item.changelog} /> },
|
||||
{ label: 'URL', value: <a href={item.url} target="_blank" rel="noopener noreferrer">{item.url}</a> },
|
||||
{ label: 'Banner File', value: <UrlUtil.BannerFile file={item.file} /> },
|
||||
{ label: 'Index', value: <ItemTypeField.ItemIndex index={item.index} /> },
|
||||
{ label: 'Related to', value: <ItemTypeField.RelatedTo relatedTo={item.related_to} /> },
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
export default UrlDetail;
|
||||
Reference in New Issue
Block a user