p90524618
/
answer
mirror of https://gitee.com/answerdev/answer.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge branch 'ui' into 'main' 

Ui

See merge request opensource/answer!31
This commit is contained in:
Ren Yubin 2022-09-30 04:04:11 +00:00
parent a113d4caa9 bd2868d828
commit dd9291e1aa
21 changed files with 65 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
ui/README.md
View File

@ -27,8 +27,8 @@ corepack prepare pnpm@latest --activate
clone the repo locally and run following command in your terminal:
```shell
$ git clone `answer repo` answer
$ cd answer
$ git clone git@github.com:answerdev/answer.git answer
$ cd answer/ui
$ pnpm install
$ pnpm run start
```

1
ui/src/common/interface.ts
View File

@ -301,6 +301,7 @@ export interface SearchResItem {
answer_count: number;
accepted: boolean;
tags: TagBase[];
status?: string;
};
}
export interface SearchRes extends ListResult<SearchResItem> {

1
ui/src/common/variable.scss
View File

@ -1 +1,2 @@
$link-hover-decoration: none;
$blue: #0033FF !default;

1
ui/src/components/Questions/index.tsx
View File

@ -144,6 +144,7 @@ const QuestionList: FC<Props> = ({ source }) => {
<h5 className="text-wrap text-break">
<NavLink to={`/questions/${li.id}`} className="text-body">
{li.title}
{li.status === 2 ? ` [${t('closed')}]` : ''}
</NavLink>
</h5>
<div className="d-flex align-items-center fs-14 text-secondary">

1
ui/src/i18n/locales/en.json
View File

@ -687,6 +687,7 @@
"modified": "modified",
"answered": "answered",
"asked": "asked",
"closed": "closed",
"follow_a_tag": "Follow a tag"
},
"personal": {

3
ui/src/index.scss
View File

@ -61,7 +61,7 @@ a {
}
.badge-tag:hover {
background: #9EC5FE;
background: #9ec5fe;
}
.divide-line {
@ -70,7 +70,6 @@ a {
.page-wrap {
min-height: calc(100vh - 148px);
overflow-y: auto;
}
.btn-no-border,

7
ui/src/pages/Questions/Ask/components/SearchQuestion/index.tsx
View File

@ -30,7 +30,12 @@ const SearchQuestion = ({ similarQuestions }) => {
key={item.id}
href={`/questions/${item.id}`}
target="_blank">
<span className="text-wrap text-break">{item.title}</span>
<span className="text-wrap text-break">
{item.title}
{item.status === 'closed'
? ` [${t('closed', { keyPrefix: 'question' })}]`
: null}
</span>
{item.accepted_answer ? (
<span className="ms-3 text-success">
<Icon type="bi" name="check-circle-fill" />

6
ui/src/pages/Questions/Ask/index.tsx
View File

@ -269,12 +269,12 @@ const Ask = () => {
<PageTitle title={pageTitle} />
<Container className="pt-4 mt-2 mb-5">
<Row className="justify-content-center">
<Col sm={12} md={10}>
<Col xxl={10} md={12}>
<h3 className="mb-4">{isEdit ? t('edit_title') : t('title')}</h3>
</Col>
</Row>
<Row className="justify-content-center">
<Col sm={12} md={7} className="mb-4 mb-md-0">
<Col xxl={7} lg={8} sm={12} className="mb-4 mb-md-0">
<Form noValidate onSubmit={handleSubmit}>
{isEdit && (
<Form.Group controlId="revision" className="mb-3">
@ -421,7 +421,7 @@ const Ask = () => {
)}
</Form>
</Col>
<Col sm={12} md={3}>
<Col xxl={3} lg={4} sm={12}>
{focusType === 'title' && (
<Card className="mb-4">
<Card.Header>{t('how_to_ask.title')}</Card.Header>

3
ui/src/pages/Questions/Detail/components/Question/index.tsx
View File

@ -50,6 +50,9 @@ const Index: FC<Props> = ({ data, initPage, hasAnswer }) => {
<h1 className="fs-3 mb-3 text-wrap text-break">
<Link className="text-body" reloadDocument to={`/questions/${data.id}`}>
{data.title}
{data.status === 2
? ` [${t('closed', { keyPrefix: 'question' })}]`
: ''}
</Link>
</h1>
<div className="d-flex align-items-center fs-14 mb-3 text-secondary">

7
ui/src/pages/Questions/Detail/index.scss
View File

@ -1,5 +1,10 @@
.fmt img {
.fmt {
img {
max-width: 100%;
}
p {
word-break: break-all;
}
}
.answer-item {

4
ui/src/pages/Questions/Detail/index.tsx
View File

@ -109,7 +109,7 @@ const Index = () => {
<PageTitle title={question?.title} />
<Container className="pt-4 mt-2 mb-5">
<Row className="justify-content-center">
<Col lg={7}>
<Col xxl={7} lg={8} sm={12}>
{question?.operation?.operation_type && (
<Alert data={question.operation} />
)}
@ -156,7 +156,7 @@ const Index = () => {
/>
)}
</Col>
<Col lg={3}>
<Col xxl={3} lg={4} sm={12}>
<RelatedQuestions id={question?.id || ''} />
</Col>
</Row>

6
ui/src/pages/Questions/EditAnswer/index.tsx
View File

@ -123,12 +123,12 @@ const Ask = () => {
<PageTitle title={t('edit_answer', { keyPrefix: 'page_title' })} />
<Container className="pt-4 mt-2 mb-5 edit-answer-wrap">
<Row className="justify-content-center">
<Col sm={12} md={10}>
<Col xxl={10} md={12}>
<h3 className="mb-4">{t('title')}</h3>
</Col>
</Row>
<Row className="justify-content-center">
<Col sm={12} md={7} className="mb-4 mb-md-0">
<Col xxl={7} lg={8} sm={12} className="mb-4 mb-md-0">
<a href={`/questions/${qid}`} target="_blank" rel="noreferrer">
<h5 className="mb-3">{data?.question.title}</h5>
</a>
@ -216,7 +216,7 @@ const Ask = () => {
</div>
</Form>
</Col>
<Col sm={12} md={3}>
<Col xxl={3} lg={4} sm={12}>
<Card className="mb-4">
<Card.Header>{t('how_to_ask.title')}</Card.Header>
<Card.Body>

4
ui/src/pages/Questions/index.tsx
View File

@ -26,10 +26,10 @@ const Questions: FC = () => {
<PageTitle title={pageTitle} suffix={slogan} />
<Container className="pt-4 mt-2 mb-5">
<Row className="justify-content-center">
<Col lg={7}>
<Col xxl={7} lg={8} sm={12}>
<QuestionList source="questions" />
</Col>
<Col lg={3}>
<Col xxl={3} lg={4} sm={12}>
<FollowingTags />
<HotQuestions />
</Col>

10
ui/src/pages/Search/components/SearchItem/index.tsx
View File

@ -1,5 +1,6 @@
import { memo, FC } from 'react';
import { ListGroupItem, Badge } from 'react-bootstrap';
import { useTranslation } from 'react-i18next';
import { Icon, Tag, FormatTime, BaseUserCard } from '@answer/components';
import type { SearchResItem } from '@answer/common/interface';
@ -8,6 +9,8 @@ interface Props {
data: SearchResItem;
}
const Index: FC<Props> = ({ data }) => {
const { t } = useTranslation('translation', { keyPrefix: 'question' });
console.log('t: ', t);
if (!data?.object_type) {
return null;
}
@ -24,6 +27,9 @@ const Index: FC<Props> = ({ data }) => {
className="h5 mb-0 text-body text-break"
href={`/questions/${data.object.id}`}>
{data.object.title}
{data.object.status === 'closed'
? ` [${t('closed', { keyPrefix: 'question' })}]`
: null}
</a>
</div>
<div className="d-flex flex-wrap align-items-center fs-14 text-secondary mb-2">
@ -51,10 +57,6 @@ const Index: FC<Props> = ({ data }) => {
)}
<span>{data.object?.answer_count}</span>
</div>
{/* <div className="d-flex align-items-center">
<Icon name="eye-fill fs-6 me-1" />
<span> 0</span>
</div> */}
</div>
</div>

4
ui/src/pages/Search/index.tsx
View File

@ -32,7 +32,7 @@ const Index = () => {
<PageTitle title={pageTitle} />
<Container className="pt-4 mt-2 mb-5">
<Row className="justify-content-center">
<Col lg={7} className="mb-3">
<Col xxl={7} lg={8} sm={12} className="mb-3">
<Head data={extra} />
<ListGroup variant="flush" className="mb-5">
@ -53,7 +53,7 @@ const Index = () => {
/>
</div>
</Col>
<Col lg={3}>
<Col xxl={3} lg={4} sm={12}>
<Tips />
</Col>
</Row>

4
ui/src/pages/Tags/Detail/index.tsx
View File

@ -58,7 +58,7 @@ const Questions: FC = () => {
<PageTitle title={pageTitle} />
<Container className="pt-4 mt-2 mb-5">
<Row className="justify-content-center">
<Col lg={7}>
<Col xxl={7} lg={8} sm={12}>
<div className="tag-box mb-5">
<h3 className="mb-3">
<Link
@ -90,7 +90,7 @@ const Questions: FC = () => {
</div>
<QuestionList source="tag" />
</Col>
<Col lg={3}>
<Col xxl={3} lg={4} sm={12}>
<FollowingTags />
<HotQuestions />
</Col>

6
ui/src/pages/Tags/Edit/index.tsx
View File

@ -147,12 +147,12 @@ const Ask = () => {
<PageTitle title={t('edit_tag', { keyPrefix: 'page_title' })} />
<Container className="pt-4 mt-2 mb-5 edit-answer-wrap">
<Row className="justify-content-center">
<Col sm={12} md={10}>
<Col xxl={10} md={12}>
<h3 className="mb-4">{t('title')}</h3>
</Col>
</Row>
<Row className="justify-content-center">
<Col sm={12} md={7} className="mb-4 mb-md-0">
<Col xxl={7} lg={8} sm={12} className="mb-4 mb-md-0">
<Form noValidate onSubmit={handleSubmit}>
<Form.Group controlId="revision" className="mb-3">
<Form.Label>{t('form.fields.revision.label')}</Form.Label>
@ -248,7 +248,7 @@ const Ask = () => {
</div>
</Form>
</Col>
<Col sm={12} md={3}>
<Col xxl={3} lg={4} sm={12}>
<Card className="mb-4">
<Card.Header>{t('how_to_format.title')}</Card.Header>
<Card.Body>

14
ui/src/pages/Tags/index.tsx
View File

@ -53,9 +53,9 @@ const Tags = () => {
<PageTitle title={t('tags', { keyPrefix: 'page_title' })} />
<Container className="py-3 my-3">
<Row className="mb-4 d-flex justify-content-center">
<Col lg={10}>
<Col xxl={10} sm={12}>
<h3 className="mb-4">{t('title')}</h3>
<div className="d-flex justify-content-between align-items-center">
<div className="d-flex justify-content-between align-items-center flex-wrap">
<Form>
<Form.Group controlId="formBasicEmail">
<Form.Control
@ -94,10 +94,16 @@ const Tags = () => {
</div>
</Col>
<Col className="mt-4" lg={10}>
<Col className="mt-4" xxl={10} sm={12}>
<Row>
{tags?.list?.map((tag) => (
<Col key={tag.slug_name} lg={3} md={4} className="mb-4">
<Col
key={tag.slug_name}
xs={12}
lg={3}
md={4}
sm={6}
className="mb-4">
<Card className="h-100">
<Card.Body className="d-flex flex-column align-items-start">
<Tag className="mb-3" href={`/tags/${tag.slug_name}`}>

4
ui/src/pages/Users/Notifications/index.tsx
View File

@ -69,7 +69,7 @@ const Notifications = () => {
<PageTitle title={t('notifications', { keyPrefix: 'page_title' })} />
<Container className="pt-4 mt-2 mb-5">
<Row className="justify-content-center">
<Col xs={12} lg={7}>
<Col xxl={7} lg={8} sm={12}>
<h3 className="mb-4">{t('title')}</h3>
<div className="d-flex justify-content-between mb-3">
<ButtonGroup size="sm">
@ -120,7 +120,7 @@ const Notifications = () => {
</div>
)}
</Col>
<Col xs={12} lg={3} />
<Col xxl={3} lg={4} sm={12} />
</Row>
</Container>
</>

3
ui/src/pages/Users/Personal/components/DefaultList/index.tsx
View File

@ -27,6 +27,9 @@ const Index: FC<Props> = ({ visible, tabName, data }) => {
tabName === 'questions' ? item.question_id : item.id
}`}>
{item.title}
{tabName === 'questions' && item.status === 'closed'
? ` [${t('closed', { keyPrefix: 'question' })}]`
: null}
</a>
</h6>
<div className="d-flex align-items-center fs-14 text-secondary mb-2">

8
ui/src/pages/Users/Personal/index.tsx
View File

@ -57,10 +57,10 @@ const Personal: FC = () => {
{userInfo?.info?.status !== 'normal' && userInfo?.info?.status_msg && (
<Alert data={userInfo?.info.status_msg} />
)}
<Col lg={7}>
<Col xxl={7} lg={8} sm={12}>
<UserInfo data={userInfo?.info} />
</Col>
<Col lg={3} className="d-flex justify-content-end">
<Col xxl={3} lg={4} sm={12} className="d-flex justify-content-end">
{isSelf && (
<div>
<Button
@ -78,7 +78,7 @@ const Personal: FC = () => {
<Col lg={10}>
<NavBar tabName={tabName} slug={username} isSelf={isSelf} />
</Col>
<Col lg={7}>
<Col xxl={7} lg={8} sm={12}>
<Overview
visible={tabName === 'overview'}
introduction={userInfo?.info?.bio_html}
@ -111,7 +111,7 @@ const Personal: FC = () => {
</div>
)}
</Col>
<Col lg={3}>
<Col xxl={3} lg={4} sm={12}>
<h5 className="mb-3">Stats</h5>
{userInfo?.info && (
<>