[DE mobile] Add review settings
This commit is contained in:
JuliaSvinareva
parent
c541a5023f
commit
c3437aa762
|
|
@ -1,12 +1,9 @@
|
|||
import React, { Component } from 'react'
|
||||
import Notifications from '../../utils/notifications.js'
|
||||
import {observer, inject} from "mobx-react"
|
||||
|
||||
|
||||
@inject('users')
|
||||
class CollaborationController extends Component {
|
||||
constructor(props){
|
||||
super(props)
|
||||
super(props);
|
||||
|
||||
Common.Notifications.on('engineCreated', api => {
|
||||
// this.api = api;
|
||||
|
|
@ -30,6 +27,6 @@ class CollaborationController extends Component {
|
|||
render() {
|
||||
return null
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default CollaborationController;
|
||||
export default inject('users')(observer(CollaborationController));
|
||||
410
apps/common/mobile/lib/controller/collaboration/Review.jsx
Normal file
410
apps/common/mobile/lib/controller/collaboration/Review.jsx
Normal file
|
|
@ -0,0 +1,410 @@
|
|||
import React, { Component } from 'react'
|
||||
import Notifications from '../../../utils/notifications.js'
|
||||
import {observer, inject} from "mobx-react"
|
||||
import { withTranslation } from 'react-i18next';
|
||||
|
||||
import {PageReview, PageReviewChange} from "../../view/collaboration/Review";
|
||||
import {LocalStorage} from "../../../utils/LocalStorage";
|
||||
|
||||
class InitReview extends Component {
|
||||
constructor(props){
|
||||
super(props);
|
||||
|
||||
Common.Notifications.on('engineCreated', api => {
|
||||
api.asc_registerCallback('asc_onShowRevisionsChange', this.onChangeReview.bind(this));
|
||||
});
|
||||
|
||||
Common.Notifications.on('document:ready', () => {
|
||||
const api = Common.EditorApi.get();
|
||||
const appOptions = props.storeAppOptions;
|
||||
api.asc_SetTrackRevisions(appOptions.isReviewOnly || LocalStorage.getBool("de-mobile-track-changes-" + (appOptions.fileKey || '')));
|
||||
// Init display mode
|
||||
if (!appOptions.canReview) {
|
||||
const canViewReview = appOptions.isEdit || api.asc_HaveRevisionsChanges(true);
|
||||
appOptions.setCanViewReview(canViewReview);
|
||||
if (canViewReview) {
|
||||
let viewReviewMode = LocalStorage.getItem("de-view-review-mode");
|
||||
if (viewReviewMode === null)
|
||||
viewReviewMode = appOptions.customization && /^(original|final|markup)$/i.test(appOptions.customization.reviewDisplay) ? appOptions.customization.reviewDisplay.toLocaleLowerCase() : 'original';
|
||||
viewReviewMode = (appOptions.isEdit || appOptions.isRestrictedEdit) ? 'markup' : viewReviewMode;
|
||||
const displayMode = viewReviewMode.toLocaleLowerCase();
|
||||
if (displayMode === 'final') {
|
||||
api.asc_BeginViewModeInReview(true);
|
||||
} else if (displayMode === 'original') {
|
||||
api.asc_BeginViewModeInReview(false);
|
||||
} else {
|
||||
api.asc_EndViewModeInReview();
|
||||
}
|
||||
props.storeReview.changeDisplayMode(displayMode);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
onChangeReview (data) {
|
||||
const storeReview = this.props.storeReview;
|
||||
storeReview.changeArrReview(data);
|
||||
}
|
||||
|
||||
render() {
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
class Review extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.onTrackChanges = this.onTrackChanges.bind(this);
|
||||
this.onDisplayMode = this.onDisplayMode.bind(this);
|
||||
|
||||
this.appConfig = props.storeAppOptions;
|
||||
this.editorPrefix = window.editorType || '';
|
||||
|
||||
let trackChanges = typeof this.appConfig.customization == 'object' ? this.appConfig.customization.trackChanges : undefined;
|
||||
trackChanges = this.appConfig.isReviewOnly || trackChanges === true || trackChanges !== false
|
||||
&& LocalStorage.getBool(`${this.editorPrefix}-mobile-track-changes-${this.appConfig.fileKey || ''}`);
|
||||
|
||||
this.state = {
|
||||
trackChanges: trackChanges
|
||||
}
|
||||
}
|
||||
|
||||
onTrackChanges (checked) {
|
||||
const api = Common.EditorApi.get();
|
||||
if ( this.appConfig.isReviewOnly ) {
|
||||
this.setState({trackChanges: true});
|
||||
} else {
|
||||
this.setState({trackChanges: checked});
|
||||
api.asc_SetTrackRevisions(checked);
|
||||
LocalStorage.setBool(`${this.editorPrefix}-mobile-track-changes-${this.appConfig.fileKey || ''}`, checked);
|
||||
}
|
||||
}
|
||||
|
||||
onAcceptAll () {
|
||||
const api = Common.EditorApi.get();
|
||||
api.asc_AcceptAllChanges();
|
||||
}
|
||||
|
||||
onRejectAll () {
|
||||
const api = Common.EditorApi.get();
|
||||
api.asc_RejectAllChanges();
|
||||
}
|
||||
|
||||
onDisplayMode (mode) {
|
||||
const api = Common.EditorApi.get();
|
||||
if (mode === 'final') {
|
||||
api.asc_BeginViewModeInReview(true);
|
||||
} else if (mode === 'original') {
|
||||
api.asc_BeginViewModeInReview(false);
|
||||
} else {
|
||||
api.asc_EndViewModeInReview();
|
||||
}
|
||||
!this.appConfig.canReview && LocalStorage.setItem("de-view-review-mode", mode);
|
||||
this.props.storeReview.changeDisplayMode(mode);
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<PageReview trackChanges={this.state.trackChanges}
|
||||
onTrackChanges={this.onTrackChanges}
|
||||
onAcceptAll={this.onAcceptAll}
|
||||
onRejectAll={this.onRejectAll}
|
||||
onDisplayMode={this.onDisplayMode}
|
||||
/>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class ReviewChange extends Component {
|
||||
constructor (props) {
|
||||
super(props);
|
||||
this.appConfig = props.storeAppOptions;
|
||||
|
||||
if (this.appConfig && this.appConfig.canUseReviewPermissions) {
|
||||
const permissions = this.appConfig.customization.reviewPermissions;
|
||||
let arr = [];
|
||||
const groups = Common.Utils.UserInfoParser.getParsedGroups(Common.Utils.UserInfoParser.getCurrentName());
|
||||
groups && groups.forEach(function(group) {
|
||||
const item = permissions[group.trim()];
|
||||
item && (arr = arr.concat(item));
|
||||
});
|
||||
this.currentUserGroups = arr;
|
||||
}
|
||||
}
|
||||
intersection (arr1, arr2) { //Computes the list of values that are the intersection of all the arrays.
|
||||
const arr = [];
|
||||
arr1.forEach((item1) => {
|
||||
arr2.forEach((item2) => {
|
||||
if (item1 === item2) {
|
||||
arr.push(item2);
|
||||
}
|
||||
});
|
||||
});
|
||||
return arr;
|
||||
}
|
||||
getInitials (name) {
|
||||
const fio = Common.Utils.UserInfoParser.getParsedName(name).split(' ');
|
||||
let initials = fio[0].substring(0, 1).toUpperCase();
|
||||
for (let i = fio.length-1; i>0; i--) {
|
||||
if (fio[i][0]!=='(' && fio[i][0]!==')') {
|
||||
initials += fio[i].substring(0, 1).toUpperCase();
|
||||
break;
|
||||
}
|
||||
}
|
||||
return initials;
|
||||
}
|
||||
checkUserGroups (username) {
|
||||
const groups = Common.Utils.UserInfoParser.getParsedGroups(username);
|
||||
return this.currentUserGroups && groups && (this.intersection(this.currentUserGroups, (groups.length>0) ? groups : [""]).length>0);
|
||||
}
|
||||
dateToLocaleTimeString (date) {
|
||||
const format = (date) => {
|
||||
let strTime,
|
||||
hours = date.getHours(),
|
||||
minutes = date.getMinutes(),
|
||||
ampm = hours >= 12 ? 'pm' : 'am';
|
||||
|
||||
hours = hours % 12;
|
||||
hours = hours ? hours : 12; // the hour '0' should be '12'
|
||||
minutes = minutes < 10 ? '0' + minutes : minutes;
|
||||
strTime = hours + ':' + minutes + ' ' + ampm;
|
||||
|
||||
return strTime;
|
||||
};
|
||||
|
||||
// MM/dd/yyyy hh:mm AM
|
||||
return (date.getMonth() + 1) + '/' + (date.getDate()) + '/' + date.getFullYear() + ' ' + format(date);
|
||||
}
|
||||
getArrChangeReview (data) {
|
||||
const api = Common.EditorApi.get();
|
||||
|
||||
const { t } = this.props;
|
||||
const _t = t("Common.Collaboration", { returnObjects: true });
|
||||
|
||||
if (data.length === 0) return [];
|
||||
const arr = [];
|
||||
const c_paragraphLinerule = {
|
||||
LINERULE_LEAST: 0,
|
||||
LINERULE_AUTO: 1,
|
||||
LINERULE_EXACT: 2
|
||||
};
|
||||
data.forEach((item) => {
|
||||
let changeText = '', proptext = '',
|
||||
value = item.get_Value(),
|
||||
movetype = item.get_MoveType();
|
||||
switch (item.get_Type()) {
|
||||
case Asc.c_oAscRevisionsChangeType.TextAdd:
|
||||
changeText = (movetype === Asc.c_oAscRevisionsMove.NoMove) ? _t.textInserted : _t.textParaMoveTo;
|
||||
if (typeof value == 'object') {
|
||||
value.forEach( (obj) => {
|
||||
if (typeof obj === 'string')
|
||||
changeText += (' ' + Common.Utils.String.htmlEncode(obj));
|
||||
else {
|
||||
switch (obj) {
|
||||
case 0:
|
||||
changeText += (' <' + _t.textImage + '>');
|
||||
break;
|
||||
case 1:
|
||||
changeText += (' <' + _t.textShape + '>');
|
||||
break;
|
||||
case 2:
|
||||
changeText += (' <' + _t.textChart + '>');
|
||||
break;
|
||||
case 3:
|
||||
changeText += (' <' + _t.textEquation + '>');
|
||||
break;
|
||||
}
|
||||
}
|
||||
})
|
||||
} else if (typeof value === 'string') {
|
||||
changeText += (' ' + Common.Utils.String.htmlEncode(value));
|
||||
}
|
||||
break;
|
||||
case Asc.c_oAscRevisionsChangeType.TextRem:
|
||||
changeText = (movetype === Asc.c_oAscRevisionsMove.NoMove) ? _t.textDeleted : (item.is_MovedDown() ? _t.textParaMoveFromDown : _t.textParaMoveFromUp);
|
||||
if (typeof value == 'object') {
|
||||
value.forEach( (obj) => {
|
||||
if (typeof obj === 'string')
|
||||
changeText += (' ' + Common.Utils.String.htmlEncode(obj));
|
||||
else {
|
||||
switch (obj) {
|
||||
case 0:
|
||||
changeText += (' <' + _t.textImage + '>');
|
||||
break;
|
||||
case 1:
|
||||
changeText += (' <' + _t.textShape + '>');
|
||||
break;
|
||||
case 2:
|
||||
changeText += (' <' + _t.textChart + '>');
|
||||
break;
|
||||
case 3:
|
||||
changeText += (' <' + _t.textEquation + '>');
|
||||
break;
|
||||
}
|
||||
}
|
||||
})
|
||||
} else if (typeof value === 'string') {
|
||||
changeText += (' ' + Common.Utils.String.htmlEncode(value));
|
||||
}
|
||||
break;
|
||||
case Asc.c_oAscRevisionsChangeType.ParaAdd:
|
||||
changeText = _t.textParaInserted;
|
||||
break;
|
||||
case Asc.c_oAscRevisionsChangeType.ParaRem:
|
||||
changeText = _t.textParaDeleted;
|
||||
break;
|
||||
case Asc.c_oAscRevisionsChangeType.TextPr:
|
||||
changeText = '<b>' + _t.textFormatted;
|
||||
if (value.Get_Bold() !== undefined)
|
||||
proptext += ((value.Get_Bold() ? '' : _t.textNot) + _t.textBold + ', ');
|
||||
if (value.Get_Italic() !== undefined)
|
||||
proptext += ((value.Get_Italic() ? '' : _t.textNot) + _t.textItalic + ', ');
|
||||
if (value.Get_Underline() !== undefined)
|
||||
proptext += ((value.Get_Underline() ? '' : _t.textNot) + _t.textUnderline + ', ');
|
||||
if (value.Get_Strikeout() !== undefined)
|
||||
proptext += ((value.Get_Strikeout() ? '' : _t.textNot) + _t.textStrikeout + ', ');
|
||||
if (value.Get_DStrikeout() !== undefined)
|
||||
proptext += ((value.Get_DStrikeout() ? '' : _t.textNot) + _t.textDStrikeout + ', ');
|
||||
if (value.Get_Caps() !== undefined)
|
||||
proptext += ((value.Get_Caps() ? '' : _t.textNot) + _t.textCaps + ', ');
|
||||
if (value.Get_SmallCaps() !== undefined)
|
||||
proptext += ((value.Get_SmallCaps() ? '' : _t.textNot) + _t.textSmallCaps + ', ');
|
||||
if (value.Get_VertAlign() !== undefined)
|
||||
proptext += (((value.Get_VertAlign() == 1) ? _t.textSuperScript : ((value.Get_VertAlign() == 2) ? _t.textSubScript : _t.textBaseline)) + ', ');
|
||||
if (value.Get_Color() !== undefined)
|
||||
proptext += (_t.textColor + ', ');
|
||||
if (value.Get_Highlight() !== undefined)
|
||||
proptext += (_t.textHighlight + ', ');
|
||||
if (value.Get_Shd() !== undefined)
|
||||
proptext += (_t.textShd + ', ');
|
||||
if (value.Get_FontFamily() !== undefined)
|
||||
proptext += (value.Get_FontFamily() + ', ');
|
||||
if (value.Get_FontSize() !== undefined)
|
||||
proptext += (value.Get_FontSize() + ', ');
|
||||
if (value.Get_Spacing() !== undefined)
|
||||
proptext += (_t.textSpacing + ' ' + Common.Utils.Metric.fnRecalcFromMM(value.Get_Spacing()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName() + ', ');
|
||||
if (value.Get_Position() !== undefined)
|
||||
proptext += (_t.textPosition + ' ' + Common.Utils.Metric.fnRecalcFromMM(value.Get_Position()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName() + ', ');
|
||||
if (value.Get_Lang() !== undefined)
|
||||
proptext += (Common.util.LanguageInfo.getLocalLanguageName(value.Get_Lang())[1] + ', ');
|
||||
|
||||
if (proptext.length > 0) {
|
||||
changeText += ': ';
|
||||
proptext = proptext.substring(0, proptext.length - 2);
|
||||
}
|
||||
changeText += '</b>';
|
||||
changeText += proptext;
|
||||
break;
|
||||
case Asc.c_oAscRevisionsChangeType.ParaPr:
|
||||
changeText = '<b>' + _t.textParaFormatted;
|
||||
if (value.Get_ContextualSpacing())
|
||||
proptext += ((value.Get_ContextualSpacing() ? _t.textContextual : _t.textNoContextual) + ', ');
|
||||
if (value.Get_IndLeft() !== undefined)
|
||||
proptext += (_t.textIndentLeft + ' ' + Common.Utils.Metric.fnRecalcFromMM(value.Get_IndLeft()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName() + ', ');
|
||||
if (value.Get_IndRight() !== undefined)
|
||||
proptext += (_t.textIndentRight + ' ' + Common.Utils.Metric.fnRecalcFromMM(value.Get_IndRight()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName() + ', ');
|
||||
if (value.Get_IndFirstLine() !== undefined)
|
||||
proptext += (_t.textFirstLine + ' ' + Common.Utils.Metric.fnRecalcFromMM(value.Get_IndFirstLine()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName() + ', ');
|
||||
if (value.Get_Jc() !== undefined) {
|
||||
switch (value.Get_Jc()) {
|
||||
case 0:
|
||||
proptext += (_t.textRight + ', ');
|
||||
break;
|
||||
case 1:
|
||||
proptext += (_t.textLeft + ', ');
|
||||
break;
|
||||
case 2:
|
||||
proptext += (_t.textCenter + ', ');
|
||||
break;
|
||||
case 3:
|
||||
proptext += (_t.textJustify + ', ');
|
||||
break;
|
||||
|
||||
}
|
||||
}
|
||||
if (value.Get_KeepLines() !== undefined)
|
||||
proptext += ((value.Get_KeepLines() ? _t.textKeepLines : _t.textNoKeepLines) + ', ');
|
||||
if (value.Get_KeepNext())
|
||||
proptext += ((value.Get_KeepNext() ? _t.textKeepNext : _t.textNoKeepNext) + ', ');
|
||||
if (value.Get_PageBreakBefore())
|
||||
proptext += ((value.Get_PageBreakBefore() ? _t.textBreakBefore : _t.textNoBreakBefore) + ', ');
|
||||
if (value.Get_SpacingLineRule() !== undefined && value.Get_SpacingLine() !== undefined) {
|
||||
proptext += _t.textLineSpacing;
|
||||
proptext += (((value.Get_SpacingLineRule() == c_paragraphLinerule.LINERULE_LEAST) ? _t.textAtLeast : ((value.Get_SpacingLineRule() == c_paragraphLinerule.LINERULE_AUTO) ? _t.textMultiple : _t.textExact)) + ' ');
|
||||
proptext += (((value.Get_SpacingLineRule() == c_paragraphLinerule.LINERULE_AUTO) ? value.Get_SpacingLine() : Common.Utils.Metric.fnRecalcFromMM(value.Get_SpacingLine()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName()) + ', ');
|
||||
}
|
||||
if (value.Get_SpacingBeforeAutoSpacing())
|
||||
proptext += (_t.textSpacingBefore + ' ' + _t.textAuto + ', ');
|
||||
else if (value.Get_SpacingBefore() !== undefined)
|
||||
proptext += (_t.textSpacingBefore + ' ' + Common.Utils.Metric.fnRecalcFromMM(value.Get_SpacingBefore()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName() + ', ');
|
||||
if (value.Get_SpacingAfterAutoSpacing())
|
||||
proptext += (_t.textSpacingAfter + ' ' + _t.textAuto + ', ');
|
||||
else if (value.Get_SpacingAfter() !== undefined)
|
||||
proptext += (_t.textSpacingAfter + ' ' + Common.Utils.Metric.fnRecalcFromMM(value.Get_SpacingAfter()).toFixed(2) + ' ' + Common.Utils.Metric.getCurrentMetricName() + ', ');
|
||||
if (value.Get_WidowControl())
|
||||
proptext += ((value.Get_WidowControl() ? _t.textWidow : _t.textNoWidow) + ', ');
|
||||
if (value.Get_Tabs() !== undefined)
|
||||
proptext += (_t.textTabs + ', ');
|
||||
if (value.Get_NumPr() !== undefined)
|
||||
proptext += (_t.textNum + ', ');
|
||||
if (value.Get_PStyle() !== undefined) {
|
||||
const style = api.asc_GetStyleNameById(value.Get_PStyle());
|
||||
if (style.length > 0) proptext += (style + ', ');
|
||||
}
|
||||
|
||||
if (proptext.length > 0) {
|
||||
changeText += ': ';
|
||||
proptext = proptext.substring(0, proptext.length - 2);
|
||||
}
|
||||
changeText += '</b>';
|
||||
changeText += proptext;
|
||||
break;
|
||||
case Asc.c_oAscRevisionsChangeType.TablePr:
|
||||
changeText = _t.textTableChanged;
|
||||
break;
|
||||
case Asc.c_oAscRevisionsChangeType.RowsAdd:
|
||||
changeText = _t.textTableRowsAdd;
|
||||
break;
|
||||
case Asc.c_oAscRevisionsChangeType.RowsRem:
|
||||
changeText = _t.textTableRowsDel;
|
||||
break;
|
||||
|
||||
}
|
||||
let date = (item.get_DateTime() == '') ? new Date() : new Date(item.get_DateTime());
|
||||
const user = item.get_UserName();
|
||||
const userColor = item.get_UserColor();
|
||||
const goto = (item.get_MoveType() == Asc.c_oAscRevisionsMove.MoveTo || item.get_MoveType() == Asc.c_oAscRevisionsMove.MoveFrom);
|
||||
date = this.dateToLocaleTimeString(date);
|
||||
const editable = this.appConfig.isReviewOnly && (item.get_UserId() == _userId) || !this.appConfig.isReviewOnly && (!this.appConfig.canUseReviewPermissions || this.checkUserGroups(item.get_UserName()));
|
||||
arr.push({date: date, user: user, userColor: userColor, changeText: changeText, goto: goto, editable: editable});
|
||||
});
|
||||
return arr;
|
||||
}
|
||||
|
||||
render() {
|
||||
const dataChanges = this.props.storeReview.dataChanges;
|
||||
const arrChangeReview = this.getArrChangeReview(dataChanges);
|
||||
let change;
|
||||
let goto = false;
|
||||
if (arrChangeReview.length > 0) {
|
||||
change = {
|
||||
date: arrChangeReview[0].date,
|
||||
user: arrChangeReview[0].user,
|
||||
color: arrChangeReview[0].userColor.get_hex(),
|
||||
text: arrChangeReview[0].changeText,
|
||||
initials: this.getInitials(arrChangeReview[0].user)
|
||||
};
|
||||
goto = arrChangeReview[0].goto;
|
||||
}
|
||||
return (
|
||||
<PageReviewChange change={change} goto={goto}/>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const InitReviewController = inject("storeAppOptions", "storeReview")(observer(InitReview));
|
||||
const ReviewController = inject("storeAppOptions", "storeReview")(observer(Review));
|
||||
const ReviewChangeController = withTranslation()(inject("storeAppOptions", "storeReview")(observer(ReviewChange)));
|
||||
|
||||
export {InitReviewController, ReviewController, ReviewChangeController};
|
||||
|
|
@ -3,7 +3,10 @@ import { observer, inject } from "mobx-react";
|
|||
import { Popover, List, ListItem, Navbar, NavRight, Sheet, BlockTitle, Page, View, Icon, Link } from 'framework7-react';
|
||||
import { f7 } from 'framework7-react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import {Device} from "../../utils/device";
|
||||
import {Device} from "../../../utils/device";
|
||||
|
||||
import {ReviewController, ReviewChangeController} from "../../controller/collaboration/Review";
|
||||
import {PageDisplayMode} from "./Review";
|
||||
|
||||
const PageUsers = inject("users")(observer(props => {
|
||||
const { t } = useTranslation();
|
||||
|
|
@ -29,6 +32,18 @@ const routes = [
|
|||
{
|
||||
path: '/users/',
|
||||
component: PageUsers
|
||||
},
|
||||
{
|
||||
path: '/review/',
|
||||
component: ReviewController
|
||||
},
|
||||
{
|
||||
path: '/display-mode/',
|
||||
component: PageDisplayMode
|
||||
},
|
||||
{
|
||||
path: '/review-change/',
|
||||
component: ReviewChangeController
|
||||
}
|
||||
];
|
||||
|
||||
|
|
@ -48,8 +63,17 @@ const PageCollaboration = props => {
|
|||
}
|
||||
</Navbar>
|
||||
<List>
|
||||
<ListItem link={'/users/'} title={_t.textUsers}/>
|
||||
<ListItem link="#" title={_t.textComments}/>
|
||||
<ListItem link={'/users/'} title={_t.textUsers}>
|
||||
<Icon slot="media" icon="icon-users"></Icon>
|
||||
</ListItem>
|
||||
<ListItem link="#" title={_t.textComments}>
|
||||
<Icon slot="media" icon="icon-insert-comment"></Icon>
|
||||
</ListItem>
|
||||
{window.editorType === 'de' &&
|
||||
<ListItem link={'/review/'} title={_t.textReview}>
|
||||
<Icon slot="media" icon="icon-review"></Icon>
|
||||
</ListItem>
|
||||
}
|
||||
</List>
|
||||
</Page>
|
||||
</View>
|
||||
124
apps/common/mobile/lib/view/collaboration/Review.jsx
Normal file
124
apps/common/mobile/lib/view/collaboration/Review.jsx
Normal file
|
|
@ -0,0 +1,124 @@
|
|||
import React, { Component, useEffect } from 'react';
|
||||
import { observer, inject } from "mobx-react";
|
||||
import { Page, Navbar, List, ListItem, Icon, Toggle, Toolbar, Link } from 'framework7-react';
|
||||
import { f7 } from 'framework7-react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import {Device} from "../../../utils/device";
|
||||
|
||||
const PageReview = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t('Common.Collaboration', {returnObjects: true});
|
||||
|
||||
return (
|
||||
<Page>
|
||||
<Navbar title={_t.textReview} backLink={_t.textBack}/>
|
||||
<List>
|
||||
<ListItem title={_t.textTrackChanges}>
|
||||
<Toggle checked={props.trackChanges} onToggleChange={
|
||||
(prev) => {
|
||||
props.onTrackChanges(!prev);
|
||||
}
|
||||
}/>
|
||||
</ListItem>
|
||||
<ListItem title={_t.textDisplayMode} link={'/display-mode/'} routeProps={{
|
||||
onDisplayMode: props.onDisplayMode
|
||||
}}/>
|
||||
</List>
|
||||
<List>
|
||||
<ListItem title={_t.textReviewChange} link={'/review-change/'}>
|
||||
<Icon slot="media" icon="icon-review-changes"></Icon>
|
||||
</ListItem>
|
||||
<ListItem title={_t.textAcceptAllChanges} link='#' className='no-indicator' onClick={() => {
|
||||
props.onAcceptAll();
|
||||
}}>
|
||||
<Icon slot="media" icon="icon-accept-changes"></Icon>
|
||||
</ListItem>
|
||||
<ListItem title={_t.textRejectAllChanges} link='#' className='no-indicator' onClick={() => {
|
||||
props.onRejectAll();
|
||||
}}>
|
||||
<Icon slot="media" icon="icon-reject-changes"></Icon>
|
||||
</ListItem>
|
||||
</List>
|
||||
</Page>
|
||||
)
|
||||
};
|
||||
|
||||
const DisplayMode = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t('Common.Collaboration', {returnObjects: true});
|
||||
const mode = props.storeReview.displayMode;
|
||||
return (
|
||||
<Page>
|
||||
<Navbar title={_t.textDisplayMode} backLink={_t.textBack}/>
|
||||
<List mediaList>
|
||||
<ListItem title={_t.textMarkup}
|
||||
subtitle={_t.textAllChangesEditing}
|
||||
radio
|
||||
checked={mode === 'markup'}
|
||||
onClick={() => {
|
||||
props.onDisplayMode('markup');
|
||||
}}
|
||||
></ListItem>
|
||||
<ListItem title={_t.textFinal}
|
||||
subtitle={_t.textAllChangesAcceptedPreview}
|
||||
radio
|
||||
checked={mode === 'final'}
|
||||
onClick={() => {
|
||||
props.onDisplayMode('final');
|
||||
}}
|
||||
></ListItem>
|
||||
<ListItem title={_t.textOriginal}
|
||||
subtitle={_t.textAllChangesRejectedPreview}
|
||||
radio
|
||||
checked={mode === 'original'}
|
||||
onClick={() => {
|
||||
props.onDisplayMode('original');
|
||||
}}
|
||||
></ListItem>
|
||||
</List>
|
||||
</Page>
|
||||
)
|
||||
};
|
||||
|
||||
const PageReviewChange = props => {
|
||||
const isAndroid = Device.android;
|
||||
const { t } = useTranslation();
|
||||
const _t = t('Common.Collaboration', {returnObjects: true});
|
||||
const change = props.change;
|
||||
return (
|
||||
<Page className='page-review'>
|
||||
<Navbar title={_t.textReviewChange} backLink={_t.textBack}/>
|
||||
<Toolbar position='bottom'>
|
||||
<span className='change-buttons row'>
|
||||
<span className='accept-reject row'>
|
||||
<Link id='btn-accept-change' href='#' className={!change && 'disabled'}>{_t.textAccept}</Link>
|
||||
<Link id='btn-reject-change' href='#' className={!change && 'disabled'}>{_t.textReject}</Link>
|
||||
</span>
|
||||
{props.goto && <Link href='#' id='btn-goto-change'><Icon slot='media' icon='icon-goto'/></Link>}
|
||||
</span>
|
||||
<span className='next-prev row'>
|
||||
<Link id='btn-prev-change' href='#'><Icon slot='media' icon='icon-prev-change'/></Link>
|
||||
<Link id='btn-next-change' href='#'><Icon slot='media' icon='icon-next-change'/></Link>
|
||||
</span>
|
||||
</Toolbar>
|
||||
{change ?
|
||||
<div className='block-description'>
|
||||
<div className='header-change'>
|
||||
{isAndroid &&
|
||||
<div className='initials' style={{backgroundColor: `#${change.color}`}}>{change.initials}</div>}
|
||||
<div className='info'>
|
||||
<div id='user-name'>{change.userName}</div>
|
||||
<div id='date-change'>{change.date}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='text' dangerouslySetInnerHTML={{__html: change.text}}></div>
|
||||
</div> :
|
||||
<div className='no-changes'>{_t.textNoChanges}</div>
|
||||
}
|
||||
</Page>
|
||||
)
|
||||
};
|
||||
|
||||
const PageDisplayMode = inject("storeReview")(observer(DisplayMode));
|
||||
|
||||
export {PageReview, PageDisplayMode, PageReviewChange};
|
||||
|
|
@ -38,7 +38,80 @@
|
|||
"textBack": "Back",
|
||||
"textUsers": "Users",
|
||||
"textEditUser": "Users who are editing the file:",
|
||||
"textComments": "Comments"
|
||||
"textComments": "Comments",
|
||||
"textReview": "Review",
|
||||
"textTrackChanges": "Track Changes",
|
||||
"textDisplayMode": "Display Mode",
|
||||
"textReviewChange": "Review Change",
|
||||
"textAcceptAllChanges": "Accept All Changes",
|
||||
"textRejectAllChanges": "Reject All Changes",
|
||||
"textMarkup": "Markup",
|
||||
"textFinal": "Final",
|
||||
"textOriginal": "Original",
|
||||
"textAllChangesEditing": "All changes (Editing)",
|
||||
"textAllChangesAcceptedPreview": "All changes accepted (Preview)",
|
||||
"textAllChangesRejectedPreview": "All changes rejected (Preview)",
|
||||
"textAccept": "Accept",
|
||||
"textReject": "Reject",
|
||||
"textNoChanges": "There are no changes.",
|
||||
"textInserted": "<b>Inserted:</b>",
|
||||
"textDeleted": "<b>Deleted:</b>",
|
||||
"textParaInserted": "<b>Paragraph Inserted</b> ",
|
||||
"textParaDeleted": "<b>Paragraph Deleted</b> ",
|
||||
"textFormatted": "Formatted",
|
||||
"textParaFormatted": "<b>Paragraph Formatted</b>",
|
||||
"textNot": "Not ",
|
||||
"textBold": "Bold",
|
||||
"textItalic": "Italic",
|
||||
"textStrikeout": "Strikeout",
|
||||
"textUnderline": "Underline",
|
||||
"textColor": "Font color",
|
||||
"textBaseline": "Baseline",
|
||||
"textSuperScript": "Superscript",
|
||||
"textSubScript": "Subscript",
|
||||
"textHighlight": "Highlight color",
|
||||
"textSpacing": "Spacing",
|
||||
"textDStrikeout": "Double strikeout",
|
||||
"textCaps": "All caps",
|
||||
"textSmallCaps": "Small caps",
|
||||
"textPosition": "Position",
|
||||
"textShd": "Background color",
|
||||
"textContextual": "Don't add interval between paragraphs of the same style",
|
||||
"textNoContextual": "Add interval between paragraphs of the same style",
|
||||
"textIndentLeft": "Indent left",
|
||||
"textIndentRight": "Indent right",
|
||||
"textFirstLine": "First line",
|
||||
"textRight": "Align right",
|
||||
"textLeft": "Align left",
|
||||
"textCenter": "Align center",
|
||||
"textJustify": "Align justify",
|
||||
"textBreakBefore": "Page break before",
|
||||
"textKeepNext": "Keep with next",
|
||||
"textKeepLines": "Keep lines together",
|
||||
"textNoBreakBefore": "No page break before",
|
||||
"textNoKeepNext": "Don't keep with next",
|
||||
"textNoKeepLines": "Don't keep lines together",
|
||||
"textLineSpacing": "Line Spacing: ",
|
||||
"textMultiple": "multiple",
|
||||
"textAtLeast": "at least",
|
||||
"textExact": "exactly",
|
||||
"textSpacingBefore": "Spacing before",
|
||||
"textSpacingAfter": "Spacing after",
|
||||
"textAuto": "auto",
|
||||
"textWidow": "Widow control",
|
||||
"textNoWidow": "No widow control",
|
||||
"textTabs": "Change tabs",
|
||||
"textNum": "Change numbering",
|
||||
"textEquation": "Equation",
|
||||
"textImage": "Image",
|
||||
"textChart": "Chart",
|
||||
"textShape": "Shape",
|
||||
"textTableChanged": "<b>Table Settings Changed</b>",
|
||||
"textTableRowsAdd": "<b>Table Rows Added</b>",
|
||||
"textTableRowsDel": "<b>Table Rows Deleted</b>",
|
||||
"textParaMoveTo": "<b>Moved:</b>",
|
||||
"textParaMoveFromUp": "<b>Moved Up:</b>",
|
||||
"textParaMoveFromDown": "<b>Moved Down:</b>"
|
||||
}
|
||||
},
|
||||
"Settings": {
|
||||
|
|
|
|||
|
|
@ -1,15 +1,17 @@
|
|||
|
||||
import React, {Component} from 'react';
|
||||
import React, {Component, Fragment} from 'react';
|
||||
import {inject} from "mobx-react";
|
||||
import { f7 } from "framework7-react";
|
||||
import { withTranslation } from 'react-i18next';
|
||||
import CollaborationController from '../../../../common/mobile/lib/controller/Collaboration.jsx';
|
||||
import CollaborationController from '../../../../common/mobile/lib/controller/collaboration/Collaboration.jsx';
|
||||
import {InitReviewController as ReviewController} from '../../../../common/mobile/lib/controller/collaboration/Review.jsx';
|
||||
import { onAdvancedOptions } from './settings/Download.jsx';
|
||||
|
||||
@inject("storeAppOptions", "storeDocumentSettings", "storeFocusObjects", "storeTextSettings", "storeParagraphSettings", "storeTableSettings", "storeDocumentInfo", "storeChartSettings")
|
||||
class MainController extends Component {
|
||||
constructor(props) {
|
||||
super(props)
|
||||
super(props);
|
||||
window.editorType = 'de';
|
||||
}
|
||||
|
||||
initSdk() {
|
||||
|
|
@ -315,7 +317,12 @@ class MainController extends Component {
|
|||
}
|
||||
|
||||
render() {
|
||||
return <CollaborationController />
|
||||
return (
|
||||
<Fragment>
|
||||
<CollaborationController />
|
||||
<ReviewController />
|
||||
</Fragment>
|
||||
)
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
|
|
|
|||
|
|
@ -25,6 +25,22 @@
|
|||
.toggle input[type="checkbox"]:checked + .toggle-icon {
|
||||
background-color: rgba(68,105,149,.5);
|
||||
}
|
||||
|
||||
// Review
|
||||
.page-review {
|
||||
.toolbar {
|
||||
height: 56px;
|
||||
.toolbar-inner {
|
||||
padding: 0 15px;
|
||||
.link {
|
||||
padding: 0;
|
||||
font-size: 14px;
|
||||
text-transform: uppercase;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Color Schemes
|
||||
|
|
|
|||
|
|
@ -18,4 +18,27 @@
|
|||
--f7-popover-width: 360px;
|
||||
}
|
||||
|
||||
// Review
|
||||
.page-review {
|
||||
--f7-toolbar-link-color: @themeColor;
|
||||
.toolbar {
|
||||
background-color: @white;
|
||||
box-shadow: 0 1px 10px rgba(0, 0, 0, 0.2);
|
||||
position: absolute;
|
||||
#btn-reject-change {
|
||||
margin-left: 20px;
|
||||
}
|
||||
#btn-goto-change {
|
||||
margin-left: 10px;
|
||||
}
|
||||
.next-prev {
|
||||
.link {
|
||||
width: 44px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.page-content {
|
||||
background-color: @white;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -429,6 +429,57 @@
|
|||
height: 22px;
|
||||
.encoded-svg-background('<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 22 22" fill="@{themeColor}"><g><path d="M18,12H5.1L9,15.9l-0.7,0.7l-4.5-4.5l-0.6-0.6l0.6-0.6l4.5-4.5L9,7.1L5.1,11H18V5h1v6v1H18z"/></g></svg>');
|
||||
}
|
||||
// Collaboration
|
||||
&.icon-users {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M16 7C16 9.34102 15.4162 11.1346 14.6143 12.3121C13.8071 13.4974 12.8337 14 12 14C11.1663 14 10.1929 13.4974 9.38574 12.3121C8.5838 11.1346 8 9.34102 8 7C8 4.61508 9.97853 3 12 3C14.0215 3 16 4.61508 16 7ZM15.1891 13.2201C14.2865 14.375 13.1451 15 12 15C10.8549 15 9.71347 14.375 8.81092 13.2201C7.40473 13.7844 6.21268 14.3488 5.26963 14.9224C3.55256 15.9667 3 16.8326 3 17.5C3 18.2545 3.4257 19.0877 4.82302 19.7879C6.25015 20.5031 8.57272 20.9999 12 21C15.4273 21 17.7499 20.5031 19.177 19.7879C20.5743 19.0877 21 18.2545 21 17.5C21 16.8326 20.4474 15.9667 18.7304 14.9224C17.7873 14.3488 16.5953 13.7844 15.1891 13.2201ZM15.7544 12.37C16.5137 11.0279 17 9.20917 17 7C17 4 14.5088 2 12 2C9.49121 2 7 4 7 7C7 9.20917 7.48633 11.0279 8.24563 12.37C4.38973 13.9392 2 15.579 2 17.5C2 19.9852 5 21.9999 12 22C19 22 22 19.9852 22 17.5C22 15.579 19.6103 13.9392 15.7544 12.37Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-review {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3 3H20V7H19V4H4V20H19V14H20V21H3V3Z" fill="@{themeColor}"/><path d="M16 8H7V7H16V8Z" fill="@{themeColor}"/><path d="M7 10H16V9H7V10Z" fill="@{themeColor}"/><path d="M14 12H7V11H14V12Z" fill="@{themeColor}"/><path d="M7 14H12V13H7V14Z" fill="@{themeColor}"/><path d="M11 16H7V15H11V16Z" fill="@{themeColor}"/><path d="M13 15.5V17H14.5L22.5 9L21 7.5L13 15.5Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-review-changes {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M19 10H5V9H19V10Z" fill="@{themeColor}"/><path d="M19 13H5V12H19V13Z" fill="@{themeColor}"/><path d="M19 16H5V15H19V16Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 6H3V19H21V6ZM3 5H2V6V19V20H3H21H22V19V6V5H21H3Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-accept-changes {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 20L9 17L8 18L12 22L22 12L21 11L12 20Z" fill="#40865C"/><path d="M19 9H5V8H19V9Z" fill="@{themeColor}"/><path d="M16 12H5V11H16V12Z" fill="@{themeColor}"/><path d="M14 15H5V14H14V15Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M3 5H21V9H22V5V4H21H3H2V5V19V20H3H6V19H3V5Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-reject-changes {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13 11L12 12L16 16L12 20L13 21L17 17L21 21L22 20L18 16L22 12L21 11L17 15L13 11Z" fill="#AA5252"/><path d="M19 9H5V8H19V9Z" fill="@{themeColor}"/><path d="M10 12H5V11H10V12Z" fill="@{themeColor}"/><path d="M10 15H5V14H10V15Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M3 5H21V9H22V5V4H21H3H2V5V19V20H3H10V19H3V5Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-accept {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9 18L2 11L1 12L9 20L23 6L22 5L9 18Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-reject {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5 4L4 5L11 12L4 19L5 20L12 13L19 20L20 19L13 12L20 5L19 4L12 11L5 4Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-next-change {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clipnext)"><path d="M16 12L6.5 22L7.5 23L18 12L7.5 1L6.5 2L16 12Z" fill="@{themeColor}"/></g><defs><clipPath id="clipnext"><rect width="24" height="24" fill="none"/></clipPath></defs></svg>');
|
||||
}
|
||||
&.icon-prev-change {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clipprev)"><path d="M8 12L17.5 2L16.5 1L6 12L16.5 23L17.5 22L8 12Z" fill="@{themeColor}"/></g><defs><clipPath id="clipprev"><rect width="24" height="24" fill="none"/></clipPath></defs></svg>');
|
||||
}
|
||||
&.icon-goto {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M21 3H3V21H21V3ZM3 2H2V3V21V22H3H21H22V21V3V2H21H3ZM15.2929 8H9V7H16.5H17V7.5V15H16V8.70711L7.35355 17.3536L6.64645 16.6464L15.2929 8Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
}
|
||||
.tab-link-active {
|
||||
i.icon {
|
||||
|
|
|
|||
|
|
@ -372,5 +372,56 @@
|
|||
height: 22px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10 9.01309L11.4062 10.4181L7.79688 14.0241H17.9844V4.00208H20V15.9911H7.79688L11.4062 19.5971L10 21.0021L4 15.0076L10 9.01309Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
// Collaboration
|
||||
&.icon-users {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M15.5 7C15.5 9.26153 14.9357 10.9518 14.201 12.0307C13.4584 13.121 12.6234 13.5 12 13.5C11.3766 13.5 10.5416 13.121 9.79901 12.0307C9.0643 10.9518 8.5 9.26153 8.5 7C8.5 4.92262 10.2222 3.5 12 3.5C13.7778 3.5 15.5 4.92262 15.5 7ZM14.8461 13.6216C14.006 14.5191 13.0044 15 12 15C10.9956 15 9.99399 14.5191 9.15395 13.6216C7.69714 14.1996 6.4782 14.7725 5.52945 15.3496C3.82884 16.3839 3.5 17.1203 3.5 17.5C3.5 18.0104 3.76355 18.6977 5.04703 19.3409C6.37522 20.0065 8.60909 20.4999 12 20.5C15.3909 20.5 17.6248 20.0065 18.953 19.3409C20.2364 18.6977 20.5 18.0104 20.5 17.5C20.5 17.1203 20.1712 16.3839 18.4705 15.3496C17.5218 14.7725 16.3029 14.1996 14.8461 13.6216ZM15.7544 12.37C16.5137 11.0279 17 9.20917 17 7C17 4 14.5088 2 12 2C9.49121 2 7 4 7 7C7 9.20917 7.48633 11.0279 8.24563 12.37C4.38973 13.9392 2 15.579 2 17.5C2 19.9852 5 21.9999 12 22C19 22 22 19.9852 22 17.5C22 15.579 19.6103 13.9392 15.7544 12.37Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-review {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M17.5 3.5H4.5V20.5H17.5V18H19V20C19 20.5321 18.7973 21.0297 18.3918 21.4366C17.9864 21.8122 17.5302 22 17 22H5C4.46979 22 4.01364 21.8122 3.60819 21.4366C3.20273 21.0297 3 20.5266 3 19.9945V4C3 2.89543 3.89543 2 5 2H17C17.5302 2 17.9864 2.20344 18.3918 2.61033C18.7661 2.98592 19 3.46792 19 4V7H17.5V3.5Z" fill="@{themeColor}"/><path d="M22.8438 10.2396L21.8281 11.2552L19.7448 9.17188L20.7604 8.15625C20.8646 8.05208 20.9948 8 21.151 8C21.3073 8 21.4375 8.05208 21.5417 8.15625L22.8438 9.45833C22.9479 9.5625 23 9.69271 23 9.84896C23 10.0052 22.9479 10.1354 22.8438 10.2396ZM13 15.9167L19.1458 9.77083L21.2292 11.8542L15.0833 18H13V15.9167Z" fill="@{themeColor}"/><path d="M7 15.5H11V17H7V15.5Z" fill="@{themeColor}"/><path d="M7 11H13V12.5H7V11Z" fill="@{themeColor}"/><path d="M7 7H15V8.5H7V7Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-review-changes {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20.5 4.5L20.5 19.5L3.5 19.5L3.5 4.5L20.5 4.5ZM22 19L22 5C22 3.89543 21.1046 3 20 3L4.00549 3C3.47341 3 2.97026 3.20273 2.56338 3.60819C2.18779 4.01364 2 4.46978 2 5L2 19C2 19.5302 2.18779 19.9864 2.56338 20.3918C2.97026 20.7973 3.46792 21 4 21L20 21C20.5321 21 21.0141 20.7661 21.3897 20.3918C21.7966 19.9864 22 19.5302 22 19Z" fill="@{themeColor}"/><path d="M6 15H18V16.5H6V15Z" fill="@{themeColor}"/><path d="M6 11H18V12.5H6V11Z" fill="@{themeColor}"/><path d="M6 7H18V8.5H6V7Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-accept-changes {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.3966 19.2877L21.6495 11L23 12.3562L13.3966 22L9 17.5849L10.3505 16.2288L13.3966 19.2877Z" fill="#40865C"/><path fill-rule="evenodd" clip-rule="evenodd" d="M20.5 8L20.5 4.5L3.5 4.5L3.5 17.5L7 17.5L7 19L4 19C3.46792 19 2.97026 18.7973 2.56338 18.3918C2.18779 17.9864 2 17.5302 2 17L2 5C2 4.46978 2.18779 4.01364 2.56338 3.60819C2.97026 3.20273 3.4734 3 4.00549 3L20 3C21.1046 3 22 3.89543 22 5L22 8L20.5 8Z" fill="@{themeColor}"/><path d="M6 8H18V9.5H6V8Z" fill="@{themeColor}"/><path d="M6 12H16V13.5H6V12Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-reject-changes {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M23 13.4099L19.4099 17L23 20.5901L21.5901 22L18 18.4099L14.4099 22L13 20.5901L16.5901 17L13 13.4099L14.4099 12L18 15.5901L21.5901 12L23 13.4099Z" fill="#C60915"/><path fill-rule="evenodd" clip-rule="evenodd" d="M20.5 10L20.5 4.5L3.5 4.5L3.5 17.5L11 17.5L11 19L4 19C3.46792 19 2.97026 18.7973 2.56338 18.3918C2.18779 17.9864 2 17.5302 2 17L2 5C2 4.46978 2.18779 4.01364 2.56338 3.60819C2.97026 3.20273 3.4734 3 4.00549 3L20 3C21.1046 3 22 3.89543 22 5L22 10L20.5 10Z" fill="@{themeColor}"/><path d="M6 8H18V9.5H6L6 8Z" fill="@{themeColor}"/><path d="M6 12H11V13.5H6V12Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-accept {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9 18L2 11L1 12L9 20L23 6L22 5L9 18Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-reject {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5 4L4 5L11 12L4 19L5 20L12 13L19 20L20 19L13 12L20 5L19 4L12 11L5 4Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-next-change {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.98438 6L15.9844 12L9.98438 18L8.57812 16.5938L13.1719 12L8.57812 7.40625L9.98438 6Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-prev-change {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.4219 7.40625L10.8281 12L15.4219 16.5938L14.0156 18L8.01562 12L14.0156 6L15.4219 7.40625Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
&.icon-goto {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M20.5 3.5H3.5V20.5H20.5V3.5ZM3.5 2H2V3.5V20.5V22H3.5H20.5H22V20.5V3.5V2H20.5H3.5ZM14.6893 8.25H9V6.75H16.5H17.25V7.5V15H15.75V9.31066L7.53033 17.5303L6.46967 16.4697L14.6893 8.25Z" fill="@{themeColor}"/></svg>');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -4,7 +4,7 @@ import { Page, View, Navbar, NavLeft, NavRight, Link, Icon } from 'framework7-re
|
|||
import EditOptions from '../view/edit/Edit';
|
||||
import AddOptions from '../view/add/Add';
|
||||
import Settings from '../view/settings/Settings';
|
||||
import Collaboration from '../../../../common/mobile/lib/view/Collaboration.jsx'
|
||||
import Collaboration from '../../../../common/mobile/lib/view/collaboration/Collaboration.jsx'
|
||||
import { Device } from '../../../../common/mobile/utils/device'
|
||||
import { Search, SearchSettings } from '../controller/Search';
|
||||
import { ContextMenu } from '../controller/ContextMenu';
|
||||
|
|
|
|||
|
|
@ -71,4 +71,7 @@ export class storeAppOptions {
|
|||
|
||||
this.canUseReviewPermissions = this.canLicense && this.customization && this.customization.reviewPermissions && (typeof (this.customization.reviewPermissions) == 'object');
|
||||
}
|
||||
@action setCanViewReview (value) {
|
||||
this.canViewReview = value;
|
||||
}
|
||||
}
|
||||
|
|
@ -12,6 +12,7 @@ import {storeDocumentInfo} from "./documentInfo";
|
|||
import {storeApplicationSettings} from './applicationSettings';
|
||||
import {storeAppOptions} from "./appOptions";
|
||||
import {storePalette} from "./palette";
|
||||
import {storeReview} from "./review";
|
||||
|
||||
export const stores = {
|
||||
storeAppOptions: new storeAppOptions(),
|
||||
|
|
@ -26,6 +27,7 @@ export const stores = {
|
|||
storeTableSettings: new storeTableSettings(),
|
||||
storeDocumentInfo: new storeDocumentInfo(),
|
||||
storeApplicationSettings: new storeApplicationSettings(),
|
||||
storePalette: new storePalette()
|
||||
storePalette: new storePalette(),
|
||||
storeReview: new storeReview()
|
||||
};
|
||||
|
||||
|
|
|
|||
15
apps/documenteditor/mobile/src/store/review.js
Normal file
15
apps/documenteditor/mobile/src/store/review.js
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
import {action, observable, computed} from 'mobx';
|
||||
|
||||
export class storeReview {
|
||||
@observable displayMode = 'markup';
|
||||
|
||||
@action changeDisplayMode (mode) {
|
||||
this.displayMode = mode;
|
||||
}
|
||||
|
||||
@observable dataChanges = [];
|
||||
|
||||
@action changeArrReview (data) {
|
||||
this.dataChanges = data && data.length > 0 ? data : [];
|
||||
}
|
||||
}
|
||||
|
|
@ -3,7 +3,7 @@ import React, { Component } from 'react'
|
|||
import { inject } from "mobx-react";
|
||||
import { f7 } from "framework7-react";
|
||||
import { withTranslation } from 'react-i18next';
|
||||
import CollaborationController from '../../../../common/mobile/lib/controller/Collaboration.jsx'
|
||||
import CollaborationController from '../../../../common/mobile/lib/controller/collaboration/Collaboration.jsx'
|
||||
|
||||
@inject("storeFocusObjects", "storeAppOptions", "storePresentationInfo", "storePresentationSettings", "storeSlideSettings", "storeTextSettings", "storeTableSettings", "storeChartSettings", "storeLinkSettings")
|
||||
class MainController extends Component {
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { Page, View, Navbar, NavLeft, NavRight, Link, Icon } from 'framework7-re
|
|||
import EditOptions from '../view/edit/Edit';
|
||||
import AddOptions from '../view/add/Add';
|
||||
import Settings from '../view/settings/Settings';
|
||||
import CollaborationView from '../../../../common/mobile/lib/view/Collaboration.jsx'
|
||||
import CollaborationView from '../../../../common/mobile/lib/view/collaboration/Collaboration.jsx'
|
||||
|
||||
export default class MainPage extends Component {
|
||||
constructor(props) {
|
||||
|
|
|
|||
|
|
@ -89,9 +89,16 @@
|
|||
},
|
||||
"Common": {
|
||||
"ThemeColorPalette": {
|
||||
"textThemeColors": "Theme Colors",
|
||||
"textStandartColors": "Standard Colors",
|
||||
"textCustomColors": "Custom Colors"
|
||||
"textThemeColors": "Theme Colors",
|
||||
"textStandartColors": "Standard Colors",
|
||||
"textCustomColors": "Custom Colors"
|
||||
},
|
||||
"Collaboration": {
|
||||
"textCollaboration": "Collaboration",
|
||||
"textBack": "Back",
|
||||
"textUsers": "Users",
|
||||
"textEditUser": "Users who are editing the file:",
|
||||
"textComments": "Comments"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import React, { Component } from 'react'
|
|||
import { inject } from "mobx-react";
|
||||
import { f7 } from 'framework7-react';
|
||||
import { withTranslation } from 'react-i18next';
|
||||
import CollaborationController from '../../../../common/mobile/lib/controller/Collaboration.jsx'
|
||||
import CollaborationController from '../../../../common/mobile/lib/controller/collaboration/Collaboration.jsx'
|
||||
|
||||
@inject("storeFocusObjects")
|
||||
class MainController extends Component {
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { Page, View, Navbar, NavLeft, NavRight, Link, Icon } from 'framework7-re
|
|||
|
||||
// import EditOptions from '../view/edit/Edit';
|
||||
import Settings from '../view/settings/Settings';
|
||||
import CollaborationView from '../../../../common/mobile/lib/view/Collaboration.jsx'
|
||||
import CollaborationView from '../../../../common/mobile/lib/view/collaboration/Collaboration.jsx'
|
||||
import CellEditor from '../controller/CellEditor';
|
||||
import Statusbar from '../controller/StatusBar'
|
||||
import AddOptions from "../view/add/Add";
|
||||
|
|
|
|||
Loading…
Reference in a new issue