[SSE mobile] Add styles, corrected unhide and hiding
This commit is contained in:
SergeyEzhin
parent
61b1c71319
commit
705509e340
|
|
@ -490,4 +490,17 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.actions-button {
|
||||
background: rgba(255,255,255,.95);
|
||||
}
|
||||
|
||||
.actions-button-text {
|
||||
height: 57px;
|
||||
line-height: 57px;
|
||||
font-size: 20px;
|
||||
color: @themeColor;
|
||||
white-space: normal;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -431,4 +431,19 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.actions-button-text {
|
||||
cursor: pointer;
|
||||
line-height: 48px;
|
||||
font-size: 16px;
|
||||
color: rgba(0,0,0,.87);
|
||||
}
|
||||
|
||||
@media (min-width: 496px) {
|
||||
.actions-modal {
|
||||
width: 100%;
|
||||
left: auto;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -23,10 +23,13 @@ const Statusbar = inject('sheets', 'storeAppOptions', 'users')(props => {
|
|||
api.asc_registerCallback('asc_onWorkbookLocked', onWorkbookLocked);
|
||||
api.asc_registerCallback('asc_onWorksheetLocked', onWorksheetLocked);
|
||||
api.asc_registerCallback('asc_onSheetsChanged', onApiSheetsChanged);
|
||||
api.asc_registerCallback('asc_onHidePopMenu', onApiHideTabContextMenu);
|
||||
};
|
||||
|
||||
const on_main_view_click = e => {
|
||||
// f7.popover.close('.document-menu.modal-in');
|
||||
if(!e.target.closest('.tab.active')) {
|
||||
f7.popover.close('.document-menu.modal-in', false);
|
||||
}
|
||||
};
|
||||
|
||||
Common.Notifications.on('api:disconnect', onApiDisconnect);
|
||||
|
|
@ -44,6 +47,10 @@ const Statusbar = inject('sheets', 'storeAppOptions', 'users')(props => {
|
|||
};
|
||||
}, []);
|
||||
|
||||
const onApiHideTabContextMenu = () => {
|
||||
f7.popover.close('.document-menu.modal-in', false);
|
||||
}
|
||||
|
||||
const onWorkbookLocked = locked => {
|
||||
locked ? $$('.idx-btn-addtab').addClass('disabled') : $$('.idx-btn-addtab').removeClass('disabled');
|
||||
};
|
||||
|
|
@ -79,7 +86,7 @@ const Statusbar = inject('sheets', 'storeAppOptions', 'users')(props => {
|
|||
|
||||
sheets.resetSheets(items);
|
||||
sheets.resetHiddenSheets(hiddentems);
|
||||
// this.hiddensheets.reset(hiddentems);
|
||||
|
||||
updateTabsColors();
|
||||
};
|
||||
|
||||
|
|
@ -164,71 +171,25 @@ const Statusbar = inject('sheets', 'storeAppOptions', 'users')(props => {
|
|||
api.asc_addWorksheet(createSheetName());
|
||||
};
|
||||
|
||||
// const _getTabMenuItems = model => {
|
||||
// const api = Common.EditorApi.get();
|
||||
// let wbLocked = api.asc_isWorkbookLocked();
|
||||
// let shLocked = api.asc_isWorksheetLockedOrDeleted(model.index);
|
||||
|
||||
// let items = [{
|
||||
// caption: _t.textDuplicate,
|
||||
// event: 'copy',
|
||||
// locked: wbLocked || shLocked
|
||||
// },{
|
||||
// caption: _t.textDelete,
|
||||
// event: 'del',
|
||||
// locked: wbLocked || shLocked
|
||||
// },{
|
||||
// caption: _t.textRename,
|
||||
// event: 'ren',
|
||||
// locked: wbLocked || shLocked
|
||||
// },{
|
||||
// caption: _t.textHide,
|
||||
// event: 'hide',
|
||||
// locked: wbLocked || shLocked
|
||||
// }];
|
||||
|
||||
|
||||
// if (!wbLocked && !shLocked && this.hiddensheets.length) {
|
||||
// items.push({
|
||||
// caption: _t.textUnhide,
|
||||
// event: 'unhide'
|
||||
// });
|
||||
// }
|
||||
|
||||
// if (Common.SharedSettings.get('phone') && items.length > 3) {
|
||||
// this._moreAction = items.slice(2);
|
||||
|
||||
// items = items.slice(0, 2);
|
||||
// items.push({
|
||||
// caption: this.menuMore,
|
||||
// event: 'showMore'
|
||||
// });
|
||||
// }
|
||||
|
||||
// return items;
|
||||
// };
|
||||
|
||||
const onTabClick = (i, target) => {
|
||||
const api = Common.EditorApi.get();
|
||||
const model = sheets.at(i);
|
||||
console.log(model);
|
||||
|
||||
let opened = $$('.document-menu.modal-in').length;
|
||||
f7.popover.close('.document-menu.modal-in');
|
||||
|
||||
let index = model.index;
|
||||
|
||||
f7.popover.close('.document-menu.modal-in', false);
|
||||
|
||||
if (index == api.asc_getActiveWorksheetIndex()) {
|
||||
if (!opened) {
|
||||
if (!isDisconnected) {
|
||||
api.asc_closeCellEditor();
|
||||
// const items = _getTabMenuItems(model);
|
||||
// this.statusbar.showTabContextMenu(this._getTabMenuItems(model), model);
|
||||
f7.popover.open('#idx-tab-context-menu-popover', target);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
f7.popover.close('#idx-tab-context-menu-popover');
|
||||
f7.popover.close('#idx-tab-context-menu-popover', false);
|
||||
onTabClicked(i);
|
||||
Common.Notifications.trigger('sheet:active', index);
|
||||
}
|
||||
|
|
@ -339,7 +300,7 @@ const Statusbar = inject('sheets', 'storeAppOptions', 'users')(props => {
|
|||
} else {
|
||||
f7.popover.close('#idx-hidden-sheets-popover');
|
||||
api['asc_showWorksheet'](index);
|
||||
// loadTabColor(index);
|
||||
loadTabColor(index);
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -347,7 +308,7 @@ const Statusbar = inject('sheets', 'storeAppOptions', 'users')(props => {
|
|||
const api = Common.EditorApi.get();
|
||||
let index = sheets.sheets.find(sheet => sheet.active).index;
|
||||
|
||||
f7.popover.close('#idx-tab-context-menu-popover');
|
||||
f7.popover.close('.document-menu.modal-in', false);
|
||||
|
||||
switch (event) {
|
||||
case 'del': deleteWorksheet(); break;
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ import AddOptions from "../view/add/Add";
|
|||
import EditOptions from "../view/edit/Edit";
|
||||
import { Device } from '../../../../common/mobile/utils/device';
|
||||
import { Search, SearchSettings } from '../controller/Search';
|
||||
import { f7 } from 'framework7-react';
|
||||
|
||||
import {FunctionGroups} from "../controller/add/AddFunction";
|
||||
|
||||
|
|
@ -26,6 +27,8 @@ export default class MainPage extends Component {
|
|||
}
|
||||
|
||||
handleClickToOpenOptions = (opts, showOpts) => {
|
||||
f7.popover.close('.document-menu.modal-in', false);
|
||||
|
||||
this.setState(state => {
|
||||
if ( opts == 'edit' )
|
||||
return {editOptionsVisible: true};
|
||||
|
|
|
|||
|
|
@ -112,32 +112,36 @@ const StatusbarView = inject('sheets')(observer(props => {
|
|||
closeByBackdropClick={false}
|
||||
closeByOutsideClick={false}
|
||||
>
|
||||
<List className="list-block">
|
||||
<ListButton title={_t.textDuplicate} onClick={() => props.onTabMenu('copy')} />
|
||||
<ListButton title={_t.textDelete} onClick={() => props.onTabMenu('del')} />
|
||||
{isPhone || isAndroid ? (
|
||||
{isPhone || isAndroid ? (
|
||||
<List className="list-block">
|
||||
<ListButton title={_t.textDuplicate} onClick={() => props.onTabMenu('copy')} />
|
||||
<ListButton title={_t.textDelete} onClick={() => props.onTabMenu('del')} />
|
||||
<ListButton title={_t.textMore} onClick={() => props.onTabMenu('showMore')} />
|
||||
) : (
|
||||
<Fragment>
|
||||
<ListButton title={_t.textRename} onClick={() => props.onTabMenu('ren')} />
|
||||
<ListButton title={_t.textHide} onClick={() => props.onTabMenu('hide')} />
|
||||
{hiddenSheets.length ? (
|
||||
<ListButton title={_t.textUnhide} onClick={() => props.onTabMenu('unhide')} />
|
||||
): null}
|
||||
</Fragment>
|
||||
)}
|
||||
</List>
|
||||
</List>
|
||||
) : (
|
||||
<List className="list-block">
|
||||
<ListButton title={_t.textDuplicate} onClick={() => props.onTabMenu('copy')} />
|
||||
<ListButton title={_t.textDelete} onClick={() => props.onTabMenu('del')} />
|
||||
<ListButton title={_t.textRename} onClick={() => props.onTabMenu('ren')} />
|
||||
<ListButton title={_t.textHide} onClick={() => props.onTabMenu('hide')} />
|
||||
{hiddenSheets.length ? (
|
||||
<ListButton title={_t.textUnhide} onClick={() => props.onTabMenu('unhide')} />
|
||||
) : null}
|
||||
</List>
|
||||
)}
|
||||
</Popover>
|
||||
{isPhone || isAndroid ? (
|
||||
<Actions id="idx-tab-menu-actions" backdrop={true} closeByBackdropClick={true}>
|
||||
<ActionsGroup>
|
||||
<ActionsButton onClick={() => props.onTabMenu('ren')}>{_t.textRename}</ActionsButton>
|
||||
<ActionsButton onClick={() => props.onTabMenu('hide')}>{_t.textHide}</ActionsButton>
|
||||
<ActionsButton onClick={() => props.onTabMenu('unhide')}>{_t.textUnhide}</ActionsButton>
|
||||
{hiddenSheets.length ? (
|
||||
<ActionsButton onClick={() => props.onTabMenu('unhide')}>{_t.textUnhide}</ActionsButton>
|
||||
) : null}
|
||||
</ActionsGroup>
|
||||
<ActionsGroup>
|
||||
<ActionsButton>{_t.textCancel}</ActionsButton>
|
||||
</ActionsGroup>
|
||||
<ActionsButton bold={true}>{_t.textCancel}</ActionsButton>
|
||||
</ActionsGroup>
|
||||
</Actions>
|
||||
) : null}
|
||||
{hiddenSheets.length ? (
|
||||
|
|
|
|||
Loading…
Reference in a new issue