mirror of
https://github.com/billsonnn/nitro-react.git
synced 2024-11-30 08:50:51 +01:00
Move guide tool
This commit is contained in:
parent
91c8ac6bd9
commit
be47f5670f
91
src/components/guide-tool/GuideToolView.scss
Normal file
91
src/components/guide-tool/GuideToolView.scss
Normal file
@ -0,0 +1,91 @@
|
||||
.nitro-guide-tool {
|
||||
width: 250px;
|
||||
|
||||
.duty-status {
|
||||
border-radius: 0.25rem;
|
||||
border-color: #B6BEC5 !important;
|
||||
background-color: #CDD3D9;
|
||||
border: 2px solid;
|
||||
}
|
||||
|
||||
.duty-switch {
|
||||
width: 38px;
|
||||
height: 21px;
|
||||
cursor: pointer;
|
||||
background-image: url(../../assets/images/guide-tool/guide_tool_duty_switch.png);
|
||||
|
||||
&.off {
|
||||
background-position: 0px -22px;
|
||||
}
|
||||
}
|
||||
|
||||
.info-icon {
|
||||
width: 23px;
|
||||
height: 24px;
|
||||
background-image: url(../../assets/images/guide-tool/guide_tool_info_icon.png);
|
||||
}
|
||||
|
||||
.chat-messages {
|
||||
height: 200px;
|
||||
min-height: 200px;
|
||||
overflow-y: auto;
|
||||
|
||||
.message-avatar {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
|
||||
.avatar-image {
|
||||
position: absolute;
|
||||
margin-left: -22px;
|
||||
margin-top: -25px;
|
||||
}
|
||||
}
|
||||
|
||||
.messages-group-left {
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
content: ' ';
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-right: 8px solid rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
|
||||
border-top: 8px solid transparent;
|
||||
border-bottom: 8px solid transparent;
|
||||
top: 10px;
|
||||
left: -8px;
|
||||
}
|
||||
}
|
||||
|
||||
.messages-group-right {
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
content: ' ';
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 8px solid rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
|
||||
border-top: 8px solid transparent;
|
||||
border-bottom: 8px solid transparent;
|
||||
top: 10px;
|
||||
right: -8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.request-message {
|
||||
width: 100%;
|
||||
min-width: 100%;
|
||||
max-width: 100%;
|
||||
height: 90px;
|
||||
min-height: 90px;
|
||||
max-height: 90px;
|
||||
border: none;
|
||||
resize: none;
|
||||
outline: none;
|
||||
line-height: 17px;
|
||||
}
|
||||
}
|
@ -6,13 +6,13 @@ import { CreateMessageHook, dispatchUiEvent, SendMessageHook, useUiEvent } from
|
||||
import { NitroCardHeaderView, NitroCardView } from '../../layout';
|
||||
import { GuideSessionState, GuideToolMessageGroup } from './common';
|
||||
import { GuideToolMessage } from './common/GuideToolMessage';
|
||||
import { GuideToolAcceptView } from './views/guide-accept/GuideToolAcceptView';
|
||||
import { GuideToolMenuView } from './views/guide-tool-menu/GuideToolMenuView';
|
||||
import { GuideToolOngoingView } from './views/ongoing/GuideToolOngoingView';
|
||||
import { GuideToolUserCreateRequestView } from './views/user-create-request/GuideToolUserCreateRequestView';
|
||||
import { GuideToolUserFeedbackView } from './views/user-feedback/GuideToolUserFeedbackView';
|
||||
import { GuideToolUserPendingView } from './views/user-pending/GuideToolUserPendingView';
|
||||
import { GuideToolUserThanksView } from './views/user-thanks/GuideToolUserThanksView';
|
||||
import { GuideToolAcceptView } from './views/GuideToolAcceptView';
|
||||
import { GuideToolMenuView } from './views/GuideToolMenuView';
|
||||
import { GuideToolOngoingView } from './views/GuideToolOngoingView';
|
||||
import { GuideToolUserCreateRequestView } from './views/GuideToolUserCreateRequestView';
|
||||
import { GuideToolUserFeedbackView } from './views/GuideToolUserFeedbackView';
|
||||
import { GuideToolUserPendingView } from './views/GuideToolUserPendingView';
|
||||
import { GuideToolUserThanksView } from './views/GuideToolUserThanksView';
|
||||
|
||||
export const GuideToolView: FC<{}> = props =>
|
||||
{
|
@ -1,9 +1,14 @@
|
||||
import { GuideSessionGuideDecidesMessageComposer } from '@nitrots/nitro-renderer';
|
||||
import { FC, useCallback } from 'react';
|
||||
import { LocalizeText } from '../../../../api';
|
||||
import { SendMessageHook } from '../../../../hooks';
|
||||
import { NitroCardContentView } from '../../../../layout';
|
||||
import { GuideToolAcceptViewProps } from './GuideToolAcceptView.types';
|
||||
import { LocalizeText } from '../../../api';
|
||||
import { SendMessageHook } from '../../../hooks';
|
||||
import { NitroCardContentView } from '../../../layout';
|
||||
|
||||
interface GuideToolAcceptViewProps
|
||||
{
|
||||
helpRequestDescription: string;
|
||||
helpRequestAverageTime: number;
|
||||
}
|
||||
|
||||
export const GuideToolAcceptView: FC<GuideToolAcceptViewProps> = props =>
|
||||
{
|
@ -1,7 +1,21 @@
|
||||
import { FC } from 'react';
|
||||
import { LocalizeText } from '../../../../api';
|
||||
import { NitroCardContentView } from '../../../../layout';
|
||||
import { GuideToolMenuViewProps } from './GuideToolMenuView.types';
|
||||
import { LocalizeText } from '../../../api';
|
||||
import { NitroCardContentView } from '../../../layout';
|
||||
|
||||
interface GuideToolMenuViewProps
|
||||
{
|
||||
isOnDuty: boolean;
|
||||
isHandlingGuideRequests: boolean;
|
||||
setIsHandlingGuideRequests: (value: boolean) => void;
|
||||
isHandlingHelpRequests: boolean;
|
||||
setIsHandlingHelpRequests: (value: boolean) => void;
|
||||
isHandlingBullyReports: boolean;
|
||||
setIsHandlingBullyReports: (value: boolean) => void;
|
||||
guidesOnDuty: number;
|
||||
helpersOnDuty: number;
|
||||
guardiansOnDuty: number;
|
||||
processAction: (action: string) => void;
|
||||
}
|
||||
|
||||
export const GuideToolMenuView: FC<GuideToolMenuViewProps> = props =>
|
||||
{
|
@ -1,12 +1,22 @@
|
||||
import { GuideSessionGetRequesterRoomMessageComposer, GuideSessionInviteRequesterMessageComposer, GuideSessionRequesterRoomMessageEvent, GuideSessionResolvedMessageComposer } from '@nitrots/nitro-renderer';
|
||||
import { GuideSessionMessageMessageComposer } from '@nitrots/nitro-renderer/src';
|
||||
import { FC, KeyboardEvent, useCallback, useState } from 'react';
|
||||
import { GetSessionDataManager, LocalizeText, TryVisitRoom } from '../../../../api';
|
||||
import { CreateMessageHook, SendMessageHook } from '../../../../hooks';
|
||||
import { NitroCardContentView, NitroLayoutButton, NitroLayoutFlex } from '../../../../layout';
|
||||
import { NitroLayoutBase } from '../../../../layout/base';
|
||||
import { AvatarImageView } from '../../../shared/avatar-image/AvatarImageView';
|
||||
import { GuideToolOngoingViewProps } from './GuideToolOngoingView.types';
|
||||
import { GetSessionDataManager, LocalizeText, TryVisitRoom } from '../../../api';
|
||||
import { CreateMessageHook, SendMessageHook } from '../../../hooks';
|
||||
import { NitroCardContentView, NitroLayoutButton, NitroLayoutFlex } from '../../../layout';
|
||||
import { NitroLayoutBase } from '../../../layout/base';
|
||||
import { AvatarImageView } from '../../../views/shared/avatar-image/AvatarImageView';
|
||||
import { GuideToolMessageGroup } from '../common';
|
||||
|
||||
interface GuideToolOngoingViewProps
|
||||
{
|
||||
isGuide: boolean;
|
||||
userId: number;
|
||||
userName: string;
|
||||
userFigure: string;
|
||||
isTyping: boolean;
|
||||
messageGroups: GuideToolMessageGroup[];
|
||||
}
|
||||
|
||||
export const GuideToolOngoingView: FC<GuideToolOngoingViewProps> = props =>
|
||||
{
|
@ -1,9 +1,14 @@
|
||||
import { GuideSessionCreateMessageComposer } from '@nitrots/nitro-renderer';
|
||||
import { FC, useCallback, useState } from 'react';
|
||||
import { LocalizeText } from '../../../../api';
|
||||
import { SendMessageHook } from '../../../../hooks';
|
||||
import { NitroCardContentView } from '../../../../layout';
|
||||
import { GuideToolUserCreateRequestViewProps } from './GuideTooluserCreateRequestView.types';
|
||||
import { LocalizeText } from '../../../api';
|
||||
import { SendMessageHook } from '../../../hooks';
|
||||
import { NitroCardContentView } from '../../../layout';
|
||||
|
||||
interface GuideToolUserCreateRequestViewProps
|
||||
{
|
||||
userRequest: string;
|
||||
setUserRequest: (value: string) => void;
|
||||
}
|
||||
|
||||
const MIN_REQUEST_LENGTH: number = 15;
|
||||
|
@ -1,9 +1,13 @@
|
||||
import { GuideSessionFeedbackMessageComposer } from '@nitrots/nitro-renderer';
|
||||
import { FC, useCallback } from 'react';
|
||||
import { LocalizeText } from '../../../../api';
|
||||
import { SendMessageHook } from '../../../../hooks';
|
||||
import { NitroCardContentView } from '../../../../layout';
|
||||
import { GuideToolUserFeedbackViewProps } from './GuideToolUserFeedbackView.types';
|
||||
import { LocalizeText } from '../../../api';
|
||||
import { SendMessageHook } from '../../../hooks';
|
||||
import { NitroCardContentView } from '../../../layout';
|
||||
|
||||
interface GuideToolUserFeedbackViewProps
|
||||
{
|
||||
userName: string;
|
||||
}
|
||||
|
||||
export const GuideToolUserFeedbackView: FC<GuideToolUserFeedbackViewProps> = props =>
|
||||
{
|
@ -1,9 +1,14 @@
|
||||
import { GuideSessionRequesterCancelsMessageComposer } from '@nitrots/nitro-renderer';
|
||||
import { FC, useCallback } from 'react';
|
||||
import { LocalizeText } from '../../../../api';
|
||||
import { SendMessageHook } from '../../../../hooks';
|
||||
import { NitroCardContentView } from '../../../../layout';
|
||||
import { GuideToolUserPendingViewProps } from './GuideToolUserPendingView.types';
|
||||
import { LocalizeText } from '../../../api';
|
||||
import { SendMessageHook } from '../../../hooks';
|
||||
import { NitroCardContentView } from '../../../layout';
|
||||
|
||||
interface GuideToolUserPendingViewProps
|
||||
{
|
||||
helpRequestDescription: string;
|
||||
helpRequestAverageTime: number;
|
||||
}
|
||||
|
||||
export const GuideToolUserPendingView: FC<GuideToolUserPendingViewProps> = props =>
|
||||
{
|
@ -1,6 +1,6 @@
|
||||
import { FC } from 'react';
|
||||
import { LocalizeText } from '../../../../api';
|
||||
import { NitroCardContentView } from '../../../../layout';
|
||||
import { LocalizeText } from '../../../api';
|
||||
import { NitroCardContentView } from '../../../layout';
|
||||
|
||||
export const GuideToolUserThanksView: FC<{}> = props =>
|
||||
{
|
@ -4,6 +4,7 @@
|
||||
@import './catalog/CatalogView';
|
||||
@import './chat-history/ChatHistoryView';
|
||||
@import './groups/GroupView';
|
||||
@import './guide-tool/GuideToolView';
|
||||
@import './help/HelpView';
|
||||
@import './inventory/InventoryView';
|
||||
@import './loading/LoadingView';
|
||||
|
@ -7,7 +7,6 @@ import { TransitionAnimation, TransitionAnimationTypes } from '../../layout';
|
||||
import { CampaignView } from '../../views/campaign/CampaignView';
|
||||
import { FloorplanEditorView } from '../../views/floorplan-editor/FloorplanEditorView';
|
||||
import { FriendsView } from '../../views/friends/FriendsView';
|
||||
import { GuideToolView } from '../../views/guide-tool/GuideToolView';
|
||||
import { HcCenterView } from '../../views/hc-center/HcCenterView';
|
||||
import { HotelView } from '../../views/hotel-view/HotelView';
|
||||
import { NitropediaView } from '../../views/nitropedia/NitropediaView';
|
||||
@ -17,6 +16,7 @@ import { CameraWidgetView } from '../camera/CameraWidgetView';
|
||||
import { CatalogView } from '../catalog/CatalogView';
|
||||
import { ChatHistoryView } from '../chat-history/ChatHistoryView';
|
||||
import { GroupsView } from '../groups/GroupsView';
|
||||
import { GuideToolView } from '../guide-tool/GuideToolView';
|
||||
import { HelpView } from '../help/HelpView';
|
||||
import { InventoryView } from '../inventory/InventoryView';
|
||||
import { ModToolsView } from '../mod-tools/ModToolsView';
|
||||
|
@ -7,4 +7,3 @@
|
||||
@import "./nitropedia/NitropediaView";
|
||||
@import "./hc-center/HcCenterView.scss";
|
||||
@import './campaign/CampaignView';
|
||||
@import './guide-tool/GuideToolView';
|
||||
|
@ -1,31 +0,0 @@
|
||||
.nitro-guide-tool {
|
||||
width: 250px;
|
||||
|
||||
.duty-status {
|
||||
border-radius: 0.25rem;
|
||||
border-color: #B6BEC5 !important;
|
||||
background-color: #CDD3D9;
|
||||
border: 2px solid;
|
||||
}
|
||||
|
||||
.duty-switch {
|
||||
width: 38px;
|
||||
height: 21px;
|
||||
cursor: pointer;
|
||||
background-image: url(../../assets/images/guide-tool/guide_tool_duty_switch.png);
|
||||
|
||||
&.off {
|
||||
background-position: 0px -22px;
|
||||
}
|
||||
}
|
||||
|
||||
.info-icon {
|
||||
width: 23px;
|
||||
height: 24px;
|
||||
background-image: url(../../assets/images/guide-tool/guide_tool_info_icon.png);
|
||||
}
|
||||
|
||||
|
||||
@import './views/user-create-request/GuideToolUserCreateRequestView';
|
||||
@import './views/ongoing/GuideToolOngoingView';
|
||||
}
|
@ -1,5 +0,0 @@
|
||||
export interface GuideToolAcceptViewProps
|
||||
{
|
||||
helpRequestDescription: string;
|
||||
helpRequestAverageTime: number;
|
||||
}
|
@ -1,14 +0,0 @@
|
||||
export interface GuideToolMenuViewProps
|
||||
{
|
||||
isOnDuty: boolean;
|
||||
isHandlingGuideRequests: boolean;
|
||||
setIsHandlingGuideRequests: (value: boolean) => void;
|
||||
isHandlingHelpRequests: boolean;
|
||||
setIsHandlingHelpRequests: (value: boolean) => void;
|
||||
isHandlingBullyReports: boolean;
|
||||
setIsHandlingBullyReports: (value: boolean) => void;
|
||||
guidesOnDuty: number;
|
||||
helpersOnDuty: number;
|
||||
guardiansOnDuty: number;
|
||||
processAction: (action: string) => void;
|
||||
}
|
@ -1,50 +0,0 @@
|
||||
.chat-messages {
|
||||
height: 200px;
|
||||
min-height: 200px;
|
||||
overflow-y: auto;
|
||||
|
||||
.message-avatar {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
|
||||
.avatar-image {
|
||||
position: absolute;
|
||||
margin-left: -22px;
|
||||
margin-top: -25px;
|
||||
}
|
||||
}
|
||||
|
||||
.messages-group-left {
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
content: ' ';
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-right: 8px solid rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
|
||||
border-top: 8px solid transparent;
|
||||
border-bottom: 8px solid transparent;
|
||||
top: 10px;
|
||||
left: -8px;
|
||||
}
|
||||
}
|
||||
|
||||
.messages-group-right {
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
content: ' ';
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 8px solid rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
|
||||
border-top: 8px solid transparent;
|
||||
border-bottom: 8px solid transparent;
|
||||
top: 10px;
|
||||
right: -8px;
|
||||
}
|
||||
}
|
||||
}
|
@ -1,11 +0,0 @@
|
||||
import { GuideToolMessageGroup } from '../../common';
|
||||
|
||||
export interface GuideToolOngoingViewProps
|
||||
{
|
||||
isGuide: boolean;
|
||||
userId: number;
|
||||
userName: string;
|
||||
userFigure: string;
|
||||
isTyping: boolean;
|
||||
messageGroups: GuideToolMessageGroup[];
|
||||
}
|
@ -1,12 +0,0 @@
|
||||
.request-message {
|
||||
width: 100%;
|
||||
min-width: 100%;
|
||||
max-width: 100%;
|
||||
height: 90px;
|
||||
min-height: 90px;
|
||||
max-height: 90px;
|
||||
border: none;
|
||||
resize: none;
|
||||
outline: none;
|
||||
line-height: 17px;
|
||||
}
|
@ -1,5 +0,0 @@
|
||||
export interface GuideToolUserCreateRequestViewProps
|
||||
{
|
||||
userRequest: string;
|
||||
setUserRequest: (value: string) => void;
|
||||
}
|
@ -1,4 +0,0 @@
|
||||
export interface GuideToolUserFeedbackViewProps
|
||||
{
|
||||
userName: string;
|
||||
}
|
@ -1,5 +0,0 @@
|
||||
export interface GuideToolUserPendingViewProps
|
||||
{
|
||||
helpRequestDescription: string;
|
||||
helpRequestAverageTime: number;
|
||||
}
|
Loading…
Reference in New Issue
Block a user