[SSE mobile] Corrected positioning and add functions in Context Menu
This commit is contained in:
SergeyEzhin
parent
09a494e245
commit
5af6d41c80
|
|
@ -1,262 +1,15 @@
|
|||
|
||||
import React, { Fragment, useEffect } from 'react';
|
||||
import React, { Fragment, useEffect, useState } from 'react';
|
||||
import {StatusbarView, TabContextMenu} from '../view/Statusbar';
|
||||
import { inject } from 'mobx-react';
|
||||
import { f7 } from 'framework7-react';
|
||||
import { Dom7 } from 'framework7';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import ContextMenuController from '../../../../common/mobile/lib/controller/ContextMenu';
|
||||
import { idContextMenuElement } from '../../../../common/mobile/lib/view/ContextMenu';
|
||||
import { Device } from '../../../../common/mobile/utils/device';
|
||||
|
||||
// @inject (stores => ({
|
||||
// isEdit: stores.storeAppOptions.isEdit,
|
||||
// sheets: stores.sheets,
|
||||
// }))
|
||||
// class Statusbar extends ContextMenuController {
|
||||
// constructor(props) {
|
||||
// super(props);
|
||||
|
||||
// this.loadTabColor = this.loadTabColor.bind(this);
|
||||
// this.onTabClick = this.onTabClick.bind(this);
|
||||
// this.onTabClicked = this.onTabClicked.bind(this);
|
||||
// this.onApiUpdateTabColor = this.onApiUpdateTabColor.bind(this);
|
||||
// this.onApiSheetsChanged = this.onApiSheetsChanged.bind(this);
|
||||
// this.onApiDisconnect = this.onApiDisconnect.bind(this);
|
||||
// };
|
||||
|
||||
// onDocumentReady() {
|
||||
// super.onDocumentReady();
|
||||
|
||||
// const api = Common.EditorApi.get();
|
||||
// api.asc_registerCallback('asc_onUpdateTabColor', this.onApiUpdateTabColor);
|
||||
// api.asc_registerCallback('asc_onSheetsChanged', this.onApiSheetsChanged);
|
||||
// api.asc_registerCallback('asc_onCoAuthoringDisconnect', this.onApiDisconnect);
|
||||
// };
|
||||
|
||||
// componentWillUnmount() {
|
||||
// super.componentWillUnmount();
|
||||
|
||||
// const api = Common.EditorApi.get();
|
||||
// api.asc_registerCallback('asc_onUpdateTabColor', this.onApiUpdateTabColor);
|
||||
// api.asc_registerCallback('asc_onSheetsChanged', this.onApiSheetsChanged);
|
||||
// api.asc_registerCallback('asc_onCoAuthoringDisconnect', this.onApiDisconnect);
|
||||
// };
|
||||
|
||||
// // const onWorkbookLocked = locked => {
|
||||
// // this.statusbar.$btnAddTab.toggleClass('disabled', locked);
|
||||
// // return;
|
||||
|
||||
// // this.statusbar.tabbar[locked?'addClass':'removeClass']('coauth-locked');
|
||||
// // this.statusbar.btnAddWorksheet.setDisabled(locked || this.statusbar.rangeSelectionMode==Asc.c_oAscSelectionDialogType.Chart ||
|
||||
// // this.statusbar.rangeSelectionMode==Asc.c_oAscSelectionDialogType.FormatTable);
|
||||
// // var item, i = this.statusbar.tabbar.getCount();
|
||||
// // while (i-- > 0) {
|
||||
// // item = this.statusbar.tabbar.getAt(i);
|
||||
// // if (item.sheetindex >= 0) {
|
||||
// // // if (locked) item.reorderable = false;
|
||||
// // // else item.reorderable = !this.api.asc_isWorksheetLockedOrDeleted(item.sheetindex);
|
||||
// // } else {
|
||||
// // item.disable(locked);
|
||||
// // }
|
||||
// // }
|
||||
// // };
|
||||
|
||||
// // const onWorksheetLocked = (index, locked) => {
|
||||
// // let model = sheets.findWhere({index: index});
|
||||
// // if(model && model.get('locked') != locked)
|
||||
// // model.set('locked', locked);
|
||||
// // };
|
||||
|
||||
// onApiSheetsChanged() {
|
||||
// console.log('on api sheets changed');
|
||||
|
||||
// const {sheets} = this.props;
|
||||
// const api = Common.EditorApi.get();
|
||||
// const sheets_count = api.asc_getWorksheetsCount();
|
||||
// const active_index = api.asc_getActiveWorksheetIndex();
|
||||
|
||||
// let i = -1, items = [];
|
||||
|
||||
// while ( ++i < sheets_count ) {
|
||||
// const tab = {
|
||||
// index : i,
|
||||
// active : active_index == i,
|
||||
// name : api.asc_getWorksheetName(i),
|
||||
// locked : api.asc_isWorksheetLockedOrDeleted(i),
|
||||
// hidden : api.asc_isWorksheetHidden(i),
|
||||
// color : api.asc_getWorksheetTabColor(i)
|
||||
// };
|
||||
|
||||
// items.push(tab);
|
||||
// }
|
||||
|
||||
// sheets.reset(items);
|
||||
// // this.hiddensheets.reset(hiddentems);
|
||||
// // updateTabsColors();
|
||||
// };
|
||||
|
||||
// loadTabColor(sheetindex) {
|
||||
// const api = Common.EditorApi.get();
|
||||
// const {sheets} = this.props;
|
||||
// let tab = sheets.findWhere({index: sheetindex});
|
||||
|
||||
// if (tab) {
|
||||
// this.setTabLineColor(tab, api.asc_getWorksheetTabColor(sheetindex));
|
||||
// }
|
||||
|
||||
// };
|
||||
|
||||
// onApiDisconnect() {
|
||||
// this.isDisconnected = true;
|
||||
// };
|
||||
|
||||
// onApiUpdateTabColor(index) {
|
||||
// this.loadTabColor(index);
|
||||
// };
|
||||
|
||||
// setTabLineColor(tab, color) {
|
||||
// if (tab) {
|
||||
// if (null !== color) {
|
||||
// color = '#' + Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b());
|
||||
// } else {
|
||||
// color = '';
|
||||
// }
|
||||
|
||||
// if (color.length) {
|
||||
// if (!tab.get('active')) {
|
||||
// color = '0px 4px 0 ' + Common.Utils.RGBColor(color).toRGBA(0.7) + ' inset';
|
||||
// } else {
|
||||
// color = '0px 4px 0 ' + color + ' inset';
|
||||
// }
|
||||
|
||||
// tab.get('el').find('a').css('box-shadow', color);
|
||||
// } else {
|
||||
// tab.get('el').find('a').css('box-shadow', '');
|
||||
// }
|
||||
// }
|
||||
// };
|
||||
|
||||
// updateTabsColors() {
|
||||
// const api = Common.EditorApi.get();
|
||||
// const {sheets} = this.props;
|
||||
|
||||
// sheets.forEach(model => {
|
||||
// setTabLineColor(model, api.asc_getWorksheetTabColor(model.get('index')));
|
||||
// });
|
||||
// };
|
||||
|
||||
// onTabClicked(i) {
|
||||
// const {sheets} = this.props;
|
||||
// const model = sheets.at(i);
|
||||
// const api = Common.EditorApi.get();
|
||||
|
||||
// api.asc_showWorksheet(model.index);
|
||||
// sheets.setActiveWorksheet(i);
|
||||
// };
|
||||
|
||||
// onAddTabClicked() {
|
||||
// const api = Common.EditorApi.get();
|
||||
// api.asc_closeCellEditor();
|
||||
|
||||
// const createSheetName = () => {
|
||||
// let items = [], wc = api.asc_getWorksheetsCount();
|
||||
// while (wc--) {
|
||||
// items.push(api.asc_getWorksheetName(wc).toLowerCase());
|
||||
// }
|
||||
|
||||
// let index = 0, name;
|
||||
// while(++index < 1000) {
|
||||
// name = /*this.strSheet*/ 'Sheet' + index;
|
||||
// if (items.indexOf(name.toLowerCase()) < 0) break;
|
||||
// }
|
||||
|
||||
// return name;
|
||||
// };
|
||||
|
||||
// api.asc_addWorksheet(createSheetName());
|
||||
// };
|
||||
|
||||
// _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;
|
||||
// };
|
||||
|
||||
// onTabClick(i) {
|
||||
// const api = Common.EditorApi.get();
|
||||
// const {sheets} = this.props;
|
||||
// const model = sheets.at(i);
|
||||
// const $$ = Dom7;
|
||||
|
||||
// let opened = $$('.document-menu.modal-in').length;
|
||||
// f7.popover.close('.document-menu.modal-in');
|
||||
|
||||
// if (i == api.asc_getActiveWorksheetIndex()) {
|
||||
// if (!opened) {
|
||||
// if (!this.isDisconnected) {
|
||||
// api.asc_closeCellEditor();
|
||||
// // const items = _getTabMenuItems(model);
|
||||
// // this.statusbar.showTabContextMenu(this._getTabMenuItems(model), model);
|
||||
// // f7.popover.open('#idx-tab-context-menu-popover');
|
||||
// }
|
||||
// }
|
||||
// } else {
|
||||
// this.onTabClicked(i);
|
||||
// // Common.NotificationCenter.trigger('sheet:active', sdkindex);
|
||||
// }
|
||||
// }
|
||||
|
||||
// render() {
|
||||
// return (
|
||||
// <Fragment>
|
||||
// <StatusbarView onTabClick={this.onTabClick} onTabClicked={this.onTabClicked} onAddTabClicked={this.onAddTabClicked} />
|
||||
// <TabContextMenu />
|
||||
// </Fragment>
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
|
||||
const Statusbar = inject('sheets', 'storeAppOptions')(props => {
|
||||
const {sheets, storeAppOptions} = props;
|
||||
const $$ = Dom7;
|
||||
const {t} = useTranslation();
|
||||
const _t = t('Statusbar', {returnObjects: true});
|
||||
console.log(props);
|
||||
|
|
@ -267,34 +20,20 @@ const Statusbar = inject('sheets', 'storeAppOptions')(props => {
|
|||
useEffect(() => {
|
||||
console.log("status bar did mount");
|
||||
|
||||
// Common.Notifications.on('document:ready', onDocumentReady);
|
||||
Common.Notifications.on('api:disconnect', onApiDisconnect);
|
||||
Common.Notifications.on('document:ready', onApiSheetsChanged);
|
||||
Common.Notifications.on('engineCreated', api => {
|
||||
api.asc_registerCallback('asc_onUpdateTabColor', onApiUpdateTabColor);
|
||||
// api.asc_registerCallback('asc_onWorkbookLocked', onWorkbookLocked);
|
||||
// api.asc_registerCallback('asc_onWorksheetLocked', onWorksheetLocked);
|
||||
api.asc_registerCallback('asc_onSheetsChanged', onApiSheetsChanged.bind(api));
|
||||
// api.asc_registerCallback('asc_onCoAuthoringDisconnect', onApiDisconnect);
|
||||
api.asc_registerCallback('asc_onSheetsChanged', onApiSheetsChanged);
|
||||
api.asc_registerCallback('asc_onCoAuthoringDisconnect', onApiDisconnect);
|
||||
});
|
||||
}, []);
|
||||
|
||||
// const onWorkbookLocked = locked => {
|
||||
// this.statusbar.$btnAddTab.toggleClass('disabled', locked);
|
||||
// return;
|
||||
|
||||
// this.statusbar.tabbar[locked?'addClass':'removeClass']('coauth-locked');
|
||||
// this.statusbar.btnAddWorksheet.setDisabled(locked || this.statusbar.rangeSelectionMode==Asc.c_oAscSelectionDialogType.Chart ||
|
||||
// this.statusbar.rangeSelectionMode==Asc.c_oAscSelectionDialogType.FormatTable);
|
||||
// var item, i = this.statusbar.tabbar.getCount();
|
||||
// while (i-- > 0) {
|
||||
// item = this.statusbar.tabbar.getAt(i);
|
||||
// if (item.sheetindex >= 0) {
|
||||
// // if (locked) item.reorderable = false;
|
||||
// // else item.reorderable = !this.api.asc_isWorksheetLockedOrDeleted(item.sheetindex);
|
||||
// } else {
|
||||
// item.disable(locked);
|
||||
// }
|
||||
// }
|
||||
// };
|
||||
|
||||
// const onWorksheetLocked = (index, locked) => {
|
||||
|
|
@ -303,13 +42,13 @@ const Statusbar = inject('sheets', 'storeAppOptions')(props => {
|
|||
// model.set('locked', locked);
|
||||
// };
|
||||
|
||||
const onApiSheetsChanged = api => {
|
||||
const onApiSheetsChanged = () => {
|
||||
console.log('on api sheets changed');
|
||||
|
||||
!api && (api = Common.EditorApi.get());
|
||||
|
||||
const api = Common.EditorApi.get();
|
||||
const sheets_count = api.asc_getWorksheetsCount();
|
||||
const active_index = api.asc_getActiveWorksheetIndex();
|
||||
|
||||
let i = -1, items = [];
|
||||
|
||||
while ( ++i < sheets_count ) {
|
||||
|
|
@ -332,7 +71,7 @@ const Statusbar = inject('sheets', 'storeAppOptions')(props => {
|
|||
|
||||
const loadTabColor = sheetindex => {
|
||||
const api = Common.EditorApi.get();
|
||||
let tab = sheets.findWhere({index: sheetindex});
|
||||
let tab = sheets.sheets.find(sheet => sheet.index === sheetindex);
|
||||
|
||||
if (tab) {
|
||||
setTabLineColor(tab, api.asc_getWorksheetTabColor(sheetindex));
|
||||
|
|
@ -342,11 +81,11 @@ const Statusbar = inject('sheets', 'storeAppOptions')(props => {
|
|||
|
||||
const onApiDisconnect = () => {
|
||||
isDisconnected = true;
|
||||
}
|
||||
};
|
||||
|
||||
const onApiUpdateTabColor = index => {
|
||||
loadTabColor(index);
|
||||
}
|
||||
};
|
||||
|
||||
const setTabLineColor = (tab, color) => {
|
||||
if (tab) {
|
||||
|
|
@ -370,118 +109,283 @@ const Statusbar = inject('sheets', 'storeAppOptions')(props => {
|
|||
}
|
||||
};
|
||||
|
||||
const updateTabsColors = () => {
|
||||
const api = Common.EditorApi.get();
|
||||
// const updateTabsColors = () => {
|
||||
// const api = Common.EditorApi.get();
|
||||
|
||||
sheets.forEach(model => {
|
||||
setTabLineColor(model, api.asc_getWorksheetTabColor(model.get('index')));
|
||||
});
|
||||
};
|
||||
// sheets.sheets.forEach(model => {
|
||||
// setTabLineColor(model, api.asc_getWorksheetTabColor(model.index));
|
||||
// });
|
||||
// };
|
||||
|
||||
const onTabClicked = i => {
|
||||
const model = sheets.at(i);
|
||||
|
||||
const api = Common.EditorApi.get();
|
||||
|
||||
api.asc_showWorksheet(model.index);
|
||||
sheets.setActiveWorksheet(i);
|
||||
};
|
||||
|
||||
const createSheetName = () => {
|
||||
const api = Common.EditorApi.get();
|
||||
|
||||
let items = [], wc = api.asc_getWorksheetsCount();
|
||||
while (wc--) {
|
||||
items.push(api.asc_getWorksheetName(wc).toLowerCase());
|
||||
}
|
||||
|
||||
let index = 0, name;
|
||||
while(++index < 1000) {
|
||||
name = /*this.strSheet*/ 'Sheet' + index;
|
||||
if (items.indexOf(name.toLowerCase()) < 0) break;
|
||||
}
|
||||
|
||||
return name;
|
||||
};
|
||||
|
||||
const onAddTabClicked = () => {
|
||||
const api = Common.EditorApi.get();
|
||||
api.asc_closeCellEditor();
|
||||
f7.popover.close('#idx-tab-context-menu-popover');
|
||||
|
||||
const createSheetName = () => {
|
||||
let items = [], wc = api.asc_getWorksheetsCount();
|
||||
while (wc--) {
|
||||
items.push(api.asc_getWorksheetName(wc).toLowerCase());
|
||||
}
|
||||
|
||||
let index = 0, name;
|
||||
while(++index < 1000) {
|
||||
name = /*this.strSheet*/ 'Sheet' + index;
|
||||
if (items.indexOf(name.toLowerCase()) < 0) break;
|
||||
}
|
||||
|
||||
return name;
|
||||
};
|
||||
|
||||
createSheetName();
|
||||
api.asc_addWorksheet(createSheetName());
|
||||
};
|
||||
|
||||
const _getTabMenuItems = model => {
|
||||
const api = Common.EditorApi.get();
|
||||
let wbLocked = api.asc_isWorkbookLocked();
|
||||
let shLocked = api.asc_isWorksheetLockedOrDeleted(model.index);
|
||||
// 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
|
||||
}];
|
||||
// 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 (!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);
|
||||
// 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'
|
||||
// });
|
||||
// }
|
||||
// items = items.slice(0, 2);
|
||||
// items.push({
|
||||
// caption: this.menuMore,
|
||||
// event: 'showMore'
|
||||
// });
|
||||
// }
|
||||
|
||||
return items;
|
||||
};
|
||||
// return items;
|
||||
// };
|
||||
|
||||
const onTabClick = i => {
|
||||
const onTabClick = (i, target) => {
|
||||
const api = Common.EditorApi.get();
|
||||
const model = sheets.at(i);
|
||||
const $$ = Dom7;
|
||||
console.log(model);
|
||||
|
||||
let opened = $$('.document-menu.modal-in').length;
|
||||
let index = model.index;
|
||||
|
||||
f7.popover.close('.document-menu.modal-in');
|
||||
|
||||
// const $targetEl = $$(idCntextMenuTargetElement);
|
||||
// console.log($targetEl);
|
||||
|
||||
if (i == api.asc_getActiveWorksheetIndex()) {
|
||||
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');
|
||||
f7.popover.open('#idx-tab-context-menu-popover', target);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
f7.popover.close('#idx-tab-context-menu-popover');
|
||||
onTabClicked(i);
|
||||
// Common.NotificationCenter.trigger('sheet:active', sdkindex);
|
||||
Common.Notifications.trigger('sheet:active', index);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const deleteWorksheet = () => {
|
||||
const api = Common.EditorApi.get();
|
||||
const countVisibleSheets = sheets.sheets.filter(sheet => !sheet.hidden);
|
||||
|
||||
if (sheets.sheets.length == 1 || countVisibleSheets.length == 1) {
|
||||
f7.dialog.alert(_t.textErrorLastSheet, _t.notcriticalErrorTitle);
|
||||
} else {
|
||||
f7.dialog.confirm(
|
||||
_t.textWarnDeleteSheet,
|
||||
_t.notcriticalErrorTitle,
|
||||
() => {
|
||||
if (!api.asc_deleteWorksheet()) {
|
||||
f7.dialog.alert(_t.textErrorRemoveSheet, _t.notcriticalErrorTitle);
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
const renameWorksheet = () => {
|
||||
const api = Common.EditorApi.get();
|
||||
|
||||
if (api.asc_getWorksheetsCount() > 0) {
|
||||
let sindex = api.asc_getActiveWorksheetIndex();
|
||||
|
||||
if (api.asc_isWorksheetLockedOrDeleted(sindex)) {
|
||||
return;
|
||||
}
|
||||
|
||||
let current = api.asc_getWorksheetName(api.asc_getActiveWorksheetIndex());
|
||||
|
||||
f7.dialog.create({
|
||||
title: _t.textRenameSheet,
|
||||
content:
|
||||
'<div class="input-field"><input type="text" name="modal-sheet-name" placeholder="' + _t.textSheetName + '" class="modal-text-input"></div>',
|
||||
buttons: [
|
||||
{
|
||||
text: 'OK',
|
||||
bold: true,
|
||||
onClick: function () {
|
||||
let s = $$('.modal-text-input[name="modal-sheet-name"]').val(),
|
||||
wc = api.asc_getWorksheetsCount(), items = [],
|
||||
err = !s.trim().length ? _t.textErrNotEmpty : ((s.length > 2 && s[0] == '"' && s[s.length-1] == '"' || !/[:\\\/\*\?\[\]\']/.test(s)) ? null : _t.textErrNameWrongChar);
|
||||
if (!err) {
|
||||
while (wc--) {
|
||||
if (sindex !== wc) {
|
||||
items.push(api.asc_getWorksheetName(wc).toLowerCase());
|
||||
}
|
||||
}
|
||||
if (items) {
|
||||
let testval = s.toLowerCase();
|
||||
for (var i = items.length - 1; i >= 0; --i) {
|
||||
if (items[i] === testval) {
|
||||
err = _t.textErrNameExists;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
if (err) {
|
||||
f7.dialog.alert(err, _t.notcriticalErrorTitle, () => {
|
||||
renameWorksheet();
|
||||
});
|
||||
} else if (s != current)
|
||||
api.asc_renameWorksheet(s);
|
||||
}
|
||||
},
|
||||
{
|
||||
text: _t.textCancel
|
||||
}
|
||||
]
|
||||
}).open();
|
||||
}
|
||||
};
|
||||
|
||||
const createCopyName = (orig) => {
|
||||
const api = Common.EditorApi.get();
|
||||
let wc = api.asc_getWorksheetsCount(), names = [];
|
||||
|
||||
while (wc--) {
|
||||
names.push(api.asc_getWorksheetName(wc).toLowerCase());
|
||||
}
|
||||
|
||||
let re = /^(.*)\((\d)\)$/.exec(orig);
|
||||
let first = re ? re[1] : orig + ' ';
|
||||
let index = 1, name;
|
||||
|
||||
while(++index < 1000) {
|
||||
name = first + '(' + index + ')';
|
||||
if (names.indexOf(name.toLowerCase()) < 0) break;
|
||||
}
|
||||
|
||||
return name;
|
||||
};
|
||||
|
||||
const hideWorksheet = (hide, index) => {
|
||||
const api = Common.EditorApi.get();
|
||||
const countVisibleSheets = sheets.sheets.filter(sheet => !sheet.hidden);
|
||||
|
||||
if(hide) {
|
||||
countVisibleSheets.length == 1 ?
|
||||
f7.dialog.alert(_t.textErrorLastSheet, _t.notcriticalErrorTitle) :
|
||||
api['asc_hideWorksheet']([index]);
|
||||
} else {
|
||||
api['asc_showWorksheet'](index);
|
||||
loadTabColor(index);
|
||||
}
|
||||
};
|
||||
|
||||
const onTabMenu = (event) => {
|
||||
const api = Common.EditorApi.get();
|
||||
let index = sheets.sheets.find(sheet => sheet.active).index;
|
||||
f7.popover.close('#idx-tab-context-menu-popover');
|
||||
|
||||
switch (event) {
|
||||
case 'del': deleteWorksheet(); break;
|
||||
case 'hide': hideWorksheet(true, index); break;
|
||||
case 'ins': api.asc_insertWorksheet(createSheetName()); break;
|
||||
case 'copy':
|
||||
let name = createCopyName(api.asc_getWorksheetName(api.asc_getActiveWorksheetIndex()));
|
||||
api.asc_copyWorksheet(index, name);
|
||||
break;
|
||||
case 'ren': renameWorksheet(); break;
|
||||
// case 'unhide':
|
||||
// var items = [];
|
||||
// _.each(this.hiddensheets.models, function (item) {
|
||||
// items.push({
|
||||
// caption: item.get('name'),
|
||||
// event: 'reveal:' + item.get('index')
|
||||
// })
|
||||
// });
|
||||
// _.defer(function () {
|
||||
// me.statusbar.showTabContextMenu(items, model);
|
||||
// });
|
||||
// break;
|
||||
// case 'showMore':
|
||||
// if (me._moreAction.length > 0) {
|
||||
// _.delay(function () {
|
||||
// _.each(me._moreAction, function (action) {
|
||||
// action.text = action.caption;
|
||||
// action.onClick = function () {
|
||||
// me.onTabMenu(null, action.event, model)
|
||||
// }
|
||||
// });
|
||||
|
||||
// uiApp.actions([me._moreAction, [
|
||||
// {
|
||||
// text: me.cancelButtonText,
|
||||
// bold: true
|
||||
// }
|
||||
// ]]);
|
||||
// }, 100);
|
||||
// }
|
||||
// break;
|
||||
// default:
|
||||
// var _re = /reveal\:(\d+)/.exec(event);
|
||||
// if ( _re && !!_re[1] ) {
|
||||
// me.hideWorksheet(false, parseInt(_re[1]));
|
||||
// }
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<StatusbarView onTabClick={onTabClick} onTabClicked={onTabClicked} onAddTabClicked={onAddTabClicked} />
|
||||
<TabContextMenu />
|
||||
<TabContextMenu onTabMenu={onTabMenu} />
|
||||
</Fragment>
|
||||
)
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,5 +1,23 @@
|
|||
|
||||
.device-ios {
|
||||
|
||||
input.modal-text-input {
|
||||
box-sizing: border-box;
|
||||
height: 26px;
|
||||
background: #fff;
|
||||
margin: 0;
|
||||
margin-top: 15px;
|
||||
padding: 0 5px;
|
||||
border: 1px solid rgba(0,0,0,.3);
|
||||
border-radius: 0;
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
font-family: inherit;
|
||||
display: block;
|
||||
box-shadow: 0 0 0 transparent;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
-ms-appearance: none;
|
||||
appearance: none;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,8 +9,7 @@ const viewStyle = {
|
|||
const StatusbarView = inject('sheets')(observer(props => {
|
||||
const { sheets } = props;
|
||||
|
||||
const getTabClassList = model =>
|
||||
`tab ${model.active ? 'active':''} ${model.locked ? 'locked':''}`;
|
||||
const getTabClassList = model => `tab ${model.active ? 'active' : ''} ${model.locked ? 'locked' : ''}`;
|
||||
|
||||
return <View id="idx-statusbar" className="statusbar" style={viewStyle}>
|
||||
<div id="idx-box-add-tab">
|
||||
|
|
@ -22,8 +21,8 @@ const StatusbarView = inject('sheets')(observer(props => {
|
|||
<ul className="sheet-tabs bottom">
|
||||
{sheets.sheets.map((model,i) =>
|
||||
model.hidden ? null :
|
||||
<li className={getTabClassList(model)} key={i} onClick={() => props.onTabClick(i)}>
|
||||
<a onClick={e => props.onTabClicked(i)}>{model.name}</a>
|
||||
<li className={getTabClassList(model)} key={i} onClick={(e) => props.onTabClick(i, e.target)}>
|
||||
<a /*onClick={e => props.onTabClicked(i)} */>{model.name}</a>
|
||||
</li>
|
||||
)}
|
||||
</ul>
|
||||
|
|
@ -38,7 +37,6 @@ const TabContextMenu = props => {
|
|||
backdrop={false}
|
||||
closeByBackdropClick={false}
|
||||
closeByOutsideClick={false}
|
||||
// onPopoverClosed={e => this.props.onMenuClosed()}
|
||||
>
|
||||
<List className="list-block">
|
||||
<ListButton title="Duplicate" onClick={() => props.onTabMenu('copy')} />
|
||||
|
|
@ -48,6 +46,6 @@ const TabContextMenu = props => {
|
|||
</List>
|
||||
</Popover>
|
||||
)
|
||||
}
|
||||
};
|
||||
|
||||
export {StatusbarView, TabContextMenu};
|
||||
|
|
|
|||
Loading…
Reference in a new issue