From 7d8142c3ff65ec6dcfb4ff31a1323d112a4cb313 Mon Sep 17 00:00:00 2001 From: yyc12345 Date: Mon, 8 Mar 2021 15:41:32 +0800 Subject: [PATCH] add some ui --- src/static/css/calendar.css | 6 ++- src/static/i18n/strings_en-US.properties | 23 +++++++-- src/static/i18n/strings_zh-CN.properties | 11 +++++ src/static/js/api.js | 62 ++++++++++++------------ src/static/js/datetime.js | 22 ++++----- src/static/js/localStorageAssist.js | 12 ++++- src/static/js/page/admin.js | 5 +- src/static/js/page/calendar.js | 7 ++- src/static/js/template.js | 9 ++++ src/static/js/utils.js | 8 --- src/static/tmpl/tokenItem.tmpl | 20 ++++++++ src/templates/admin.html | 36 +++++++++----- src/templates/calendar.html | 40 ++++++++++++++- 13 files changed, 190 insertions(+), 71 deletions(-) create mode 100644 src/static/tmpl/tokenItem.tmpl diff --git a/src/static/css/calendar.css b/src/static/css/calendar.css index bcdf0b7..d0aca87 100644 --- a/src/static/css/calendar.css +++ b/src/static/css/calendar.css @@ -29,6 +29,10 @@ overflow: hidden; } +#ccn-calendar-calendarBody > div > div[isCurrentMonth=false] { + background: #d0d0d0; +} + #ccn-calendar-calendarBody > div { display: flex; flex-flow: row; @@ -42,7 +46,7 @@ div.calendarItem-eventBox { border: 1px solid black; border-radius: 2px; - margin: 0.2rem; + margin-top: 0.2rem; height: 0.75rem; width: 100%; } diff --git a/src/static/i18n/strings_en-US.properties b/src/static/i18n/strings_en-US.properties index a7e116c..1598dda 100644 --- a/src/static/i18n/strings_en-US.properties +++ b/src/static/i18n/strings_en-US.properties @@ -63,10 +63,21 @@ ccn-i18n-todo-todoList=Todo list ccn-i18n-calendar-calendar-jump=Jump ccn-i18n-calendar-calendar-today=Today ccn-i18n-calendar-calendar-add=Add... +ccn-i18n-calendar-calendar-stripedEvents={0} items ccn-i18n-calendar-calendar-scheduleList=Schedule ccn-i18n-calendar-tabcontrol-tabCalendar=Calendar ccn-i18n-calendar-tabcontrol-tabCollection=Collection ccn-i18n-calendar-tabcontrol-tabDisplay=Display +ccn-i18n-calendar-owned-list=My collections +ccn-i18n-calendar-shared-list=Shared collections +ccn-i18n-calendar-display-firstDayOfWeek=The first day of week +ccn-i18n-calendar-display-subcalendar=Sub-Calendar + +ccn-i18n-calendar-display-subcalendar-chineseLunisolarCalendar=Chinese Lunisolar Calendar + +ccn-i18n-collection-owned-list=Owned +ccn-i18n-collection-sharing-list=Sharing target +ccn-i18n-collection-sharing-editing=Editing: ccn-i18n-event-header=Edit Event ccn-i18n-event-title=Title @@ -107,16 +118,20 @@ ccn-i18n-event-strictMode-strict=Strict Mode. If ordered day is not existing, sk ccn-i18n-event-strictMode-rough=Rough mode. If ordered day is not existing, choose the day closing with original day to arrange event. ccn-i18n-event-btnSubmit=Submit ccn-i18n-event-btnCancel=Cancel -ccn-i18n-calendar-shared-list=Shared -ccn-i18n-collection-owned-list=Owned -ccn-i18n-collection-sharing-list=Sharing target -ccn-i18n-collection-sharing-editing=Editing: ccn-i18n-sharedItem-sharedBy=Shared by: ccn-i18n-admin-tabcontrol-tabProfile=My Profile +ccn-i18n-admin-tabcontrol-tabToken=Manage Multi-login ccn-i18n-admin-tabcontrol-tabUserList=Manager User ccn-i18n-admin-changePassword=Change Password +ccn-i18n-admin-manageToken=Manage multi-login +ccn-i18n-admin-manageToken-desc=Manage the multi-login of the current account. You can forced logout some login in there. ccn-i18n-admin-userList=User List + ccn-i18n-userItem-newPassword=New Password ccn-i18n-userItem-isAdmin=Is Admin + +ccn-i18n-tokenItem-ua=User Agent: +ccn-i18n-tokenItem-ip=IP: +ccn-i18n-tokenItem-isMe=This is the login credentials you are currently using. diff --git a/src/static/i18n/strings_zh-CN.properties b/src/static/i18n/strings_zh-CN.properties index 3673e95..3cff856 100644 --- a/src/static/i18n/strings_zh-CN.properties +++ b/src/static/i18n/strings_zh-CN.properties @@ -63,12 +63,17 @@ ccn-i18n-todo-todoList=待办列表 ccn-i18n-calendar-calendar-jump=转到 ccn-i18n-calendar-calendar-today=今天 ccn-i18n-calendar-calendar-add=添加... +ccn-i18n-calendar-calendar-stripedEvents=共{0}项 ccn-i18n-calendar-calendar-scheduleList=日程安排 ccn-i18n-calendar-tabcontrol-tabCalendar=日历 ccn-i18n-calendar-tabcontrol-tabCollection=集合 ccn-i18n-calendar-tabcontrol-tabDisplay=显示设置 ccn-i18n-calendar-owned-list=我的集合 ccn-i18n-calendar-shared-list=被共享的集合 +ccn-i18n-calendar-display-firstDayOfWeek=每周开始星期 +ccn-i18n-calendar-display-subcalendar=副日历 + +ccn-i18n-calendar-display-subcalendar-chineseLunisolarCalendar=中国农历 ccn-i18n-collection-owned-list=我的集合 ccn-i18n-collection-sharing-list=分享目标 @@ -117,10 +122,16 @@ ccn-i18n-event-btnCancel=取消 ccn-i18n-sharedItem-sharedBy=共享人: ccn-i18n-admin-tabcontrol-tabProfile=我的资料 +ccn-i18n-admin-tabcontrol-tabToken=管理多端登录 ccn-i18n-admin-tabcontrol-tabUserList=管理用户 ccn-i18n-admin-changePassword=更改密码 +ccn-i18n-admin-manageToken=管理多端登录 +ccn-i18n-admin-manageToken-desc=管理当前帐号的多端登录。您可以在这里强制下线某些地方的帐号。 ccn-i18n-admin-userList=用户列表 ccn-i18n-userItem-newPassword=新密码 ccn-i18n-userItem-isAdmin=是管理员 +ccn-i18n-tokenItem-ua=UA: +ccn-i18n-tokenItem-ip=IP: +ccn-i18n-tokenItem-isMe=这是你当前使用的登录凭据 diff --git a/src/static/js/api.js b/src/static/js/api.js index 94635b5..18a5ee3 100644 --- a/src/static/js/api.js +++ b/src/static/js/api.js @@ -45,7 +45,7 @@ function ccn_api_common_login(_username, password) { } }); if (IsResponseOK(gotten_data) && gotten_data['data'] != '') { - SetApiToken(gotten_data['data']); + ccn_localstorageAssist_SetApiToken(gotten_data['data']); cached_salt = undefined; return true; } else return false; @@ -127,7 +127,7 @@ function ccn_api_common_webLogin(_username, _password) { } }); if (IsResponseOK(gotten_data)) { - SetApiToken(gotten_data['data']); + ccn_localstorageAssist_SetApiToken(gotten_data['data']); return true; } else return false; } @@ -140,7 +140,7 @@ function ccn_api_common_logout() { type: "POST", async: false, data: { - token: GetApiToken() + token: ccn_localstorageAssist_GetApiToken() }, success: function (data) { gotten_data = data; @@ -148,7 +148,7 @@ function ccn_api_common_logout() { }); if (IsResponseOK(gotten_data) && gotten_data['data']) { - SetApiToken(''); + ccn_localstorageAssist_SetApiToken(''); return true; } return false; } @@ -156,7 +156,7 @@ function ccn_api_common_logout() { function ccn_api_common_tokenValid() { // get from local database first, then judge it via post // return true or false - var gotten_token = GetApiToken(); + var gotten_token = ccn_localstorageAssist_GetApiToken(); if (gotten_token == '') return false; var gotten_data = undefined; @@ -165,7 +165,7 @@ function ccn_api_common_tokenValid() { type: "POST", async: false, data: { - token: GetApiToken() + token: ccn_localstorageAssist_GetApiToken() }, success: function (data) { gotten_data = data; @@ -174,7 +174,7 @@ function ccn_api_common_tokenValid() { if (IsResponseOK(gotten_data) && gotten_data['data']) return true; else { - SetApiToken(''); + ccn_localstorageAssist_SetApiToken(''); return false; } } @@ -183,7 +183,7 @@ function ccn_api_common_isAdmin() { return ccn_api_boolTemplate( '/api/common/isAdmin', { - token: GetApiToken() + token: ccn_localstorageAssist_GetApiToken() } ); } @@ -192,7 +192,7 @@ function ccn_api_common_changePassword(_password) { return ccn_api_boolTemplate( '/api/common/changePassword', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), password: _password } ); @@ -204,7 +204,7 @@ function ccn_api_calendar_getFull(_startDateTime, _endDateTime) { return ccn_api_dataTemplate( '/api/calendar/getFull', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), startDateTime: _startDateTime, endDateTime: _endDateTime } @@ -215,7 +215,7 @@ function ccn_api_calendar_getDetail(_uuid) { return ccn_api_dataTemplate( '/api/calendar/getDetail', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), uuid: _uuid } ); @@ -238,7 +238,7 @@ function ccn_api_calendar_update(_uuid, _belongTo, _title, _description, _eventD if (typeof(_timezoneOffset) != 'undefined') data.timezoneOffset = _timezoneOffset; - data.token = GetApiToken(); + data.token = ccn_localstorageAssist_GetApiToken(); data.uuid = _uuid; data.lastChange = _lastChange; return ccn_api_dataTemplate( @@ -251,7 +251,7 @@ function ccn_api_calendar_add(_belongTo, _title, _description, _eventDateTimeSta return ccn_api_dataTemplate( '/api/calendar/add', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), belongTo: _belongTo, title: _title, description: _description, @@ -267,7 +267,7 @@ function ccn_api_calendar_delete(_uuid, _lastChange) { return ccn_api_boolTemplate( '/api/calendar/delete', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), uuid: _uuid, lastChange: _lastChange } @@ -280,7 +280,7 @@ function ccn_api_collection_getFullOwn() { return ccn_api_dataTemplate( '/api/collection/getFullOwn', { - token: GetApiToken() + token: ccn_localstorageAssist_GetApiToken() } ); } @@ -289,7 +289,7 @@ function ccn_api_collection_getDetailOwn(_uuid) { return ccn_api_dataTemplate( '/api/collection/getDetailOwn', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), uuid: _uuid } ); @@ -299,7 +299,7 @@ function ccn_api_collection_addOwn(_name) { return ccn_api_dataTemplate( '/api/collection/addOwn', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), name: _name } ); @@ -309,7 +309,7 @@ function ccn_api_collection_updateOwn(_uuid, _name, _lastChange) { return ccn_api_dataTemplate( '/api/collection/updateOwn', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), uuid: _uuid, name: _name, lastChange: _lastChange @@ -321,7 +321,7 @@ function ccn_api_collection_deleteOwn(_uuid, _lastChange) { return ccn_api_boolTemplate( '/api/collection/deleteOwn', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), uuid: _uuid, lastChange: _lastChange } @@ -332,7 +332,7 @@ function ccn_api_collection_getSharing(_uuid) { return ccn_api_dataTemplate( '/api/collection/getSharing', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), uuid: _uuid } ); @@ -342,7 +342,7 @@ function ccn_api_collection_deleteSharing(_uuid, _target, _lastChange) { return ccn_api_dataTemplate( '/api/collection/deleteSharing', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), uuid: _uuid, target: _target, lastChange: _lastChange @@ -354,7 +354,7 @@ function ccn_api_collection_addSharing(_uuid, _target, _lastChange) { return ccn_api_dataTemplate( '/api/collection/addSharing', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), uuid: _uuid, target: _target, lastChange: _lastChange @@ -366,7 +366,7 @@ function ccn_api_collection_getShared() { return ccn_api_dataTemplate( '/api/collection/getShared', { - token: GetApiToken() + token: ccn_localstorageAssist_GetApiToken() } ); } @@ -377,7 +377,7 @@ function ccn_api_todo_getFull() { return ccn_api_dataTemplate( '/api/todo/getFull', { - token: GetApiToken() + token: ccn_localstorageAssist_GetApiToken() } ); } @@ -386,7 +386,7 @@ function ccn_api_todo_add() { return ccn_api_dataTemplate( '/api/todo/add', { - token: GetApiToken() + token: ccn_localstorageAssist_GetApiToken() } ); } @@ -395,7 +395,7 @@ function ccn_api_todo_update(_uuid, _data, _lastChange) { return ccn_api_dataTemplate( '/api/todo/update', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), uuid: _uuid, data: _data, lastChange: _lastChange @@ -407,7 +407,7 @@ function ccn_api_todo_delete(_uuid, _lastChange) { return ccn_api_boolTemplate( '/api/todo/delete', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), uuid: _uuid, lastChange: _lastChange } @@ -420,7 +420,7 @@ function ccn_api_admin_get() { return ccn_api_dataTemplate( '/api/admin/get', { - token: GetApiToken() + token: ccn_localstorageAssist_GetApiToken() } ); } @@ -429,7 +429,7 @@ function ccn_api_admin_add(_username) { return ccn_api_dataTemplate( '/api/admin/add', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), username: _username } ); @@ -443,7 +443,7 @@ function ccn_api_admin_update(_username, _password, _isAdmin) { data.isAdmin = _isAdmin; if (Object.getOwnPropertyNames(data).length == 0) return false; - data.token = GetApiToken(); + data.token = ccn_localstorageAssist_GetApiToken(); data.username = _username; return ccn_api_boolTemplate( '/api/admin/update', @@ -455,7 +455,7 @@ function ccn_api_admin_delete(_username) { return ccn_api_boolTemplate( '/api/admin/delete', { - token: GetApiToken(), + token: ccn_localstorageAssist_GetApiToken(), username: _username } ); diff --git a/src/static/js/datetime.js b/src/static/js/datetime.js index 7f46af1..1a2cfe1 100644 --- a/src/static/js/datetime.js +++ b/src/static/js/datetime.js @@ -1,24 +1,24 @@ // NOTE: this file is sync with dt.py. if this file or dt.py have bugs, all code should be changed -ccn_datetime_monthDayCount = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]; +var ccn_datetime_monthDayCount = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]; -ccn_datetime_MIN_YEAR = 1950; -ccn_datetime_MAX_YEAR = 2199; -ccn_datetime_MIN_DATETIME = new Date(Date.UTC(1950, 1, 1, 0, 0, 0, 0)); -ccn_datetime_MAX_DATETIME = new Date(Date.UTC(2200, 1, 1, 0, 0, 0, 0)); -ccn_datetime_MIN_TIMESTAMP = Math.floor(ccn_datetime_MIN_DATETIME.getTime() / 60000); -ccn_datetime_MAX_TIMESTAMP = Math.floor(ccn_datetime_MAX_DATETIME.getTime() / 60000); +var ccn_datetime_MIN_YEAR = 1950; +var ccn_datetime_MAX_YEAR = 2199; +var ccn_datetime_MIN_DATETIME = new Date(Date.UTC(1950, 1, 1, 0, 0, 0, 0)); +var ccn_datetime_MAX_DATETIME = new Date(Date.UTC(2200, 1, 1, 0, 0, 0, 0)); +var ccn_datetime_MIN_TIMESTAMP = Math.floor(ccn_datetime_MIN_DATETIME.getTime() / 60000); +var ccn_datetime_MAX_TIMESTAMP = Math.floor(ccn_datetime_MAX_DATETIME.getTime() / 60000); -ccn_datetime_DAY1_SPAN = 60 * 24; -ccn_datetime_DAY7_SPAN = 7 * ccn_datetime_DAY1_SPAN; +var ccn_datetime_DAY1_SPAN = 60 * 24; +var ccn_datetime_DAY7_SPAN = 7 * ccn_datetime_DAY1_SPAN; -ccn_datetime_precompiledLoopRules = { +var ccn_datetime_precompiledLoopRules = { year: new RegExp(/^Y([SR]{1})([1-9]\d*)$/), month: new RegExp(/^M([SR]{1})([ABCD]{1})([1-9]\d*)$/), week: new RegExp(/^W([TF]{7})([1-9]\d*)$/), day: new RegExp(/^D([1-9]\d*)$/) }; -ccn_datetime_precompiledLoopStopRules = { +var ccn_datetime_precompiledLoopStopRules = { infinity: new RegExp(/^F$/), datetime: new RegExp(/^D([1-9]\d*|0)$/), times: new RegExp(/^T([1-9]\d*)$/) diff --git a/src/static/js/localStorageAssist.js b/src/static/js/localStorageAssist.js index 63d2989..6ee06e6 100644 --- a/src/static/js/localStorageAssist.js +++ b/src/static/js/localStorageAssist.js @@ -8,4 +8,14 @@ function ccn_localstorageAssist_Get(index, defaultValue) { function ccn_localstorageAssist_Set(index, value) { localStorage.setItem(index, value); -} \ No newline at end of file +} + +// =================================== seperated data getter setter + +function ccn_localstorageAssist_GetApiToken() { + return ccn_localstorageAssist_Get('ccn-token', ''); +} + +function ccn_localstorageAssist_SetApiToken(value) { + ccn_localstorageAssist_Set('ccn-token', value); +} diff --git a/src/static/js/page/admin.js b/src/static/js/page/admin.js index 0017930..6acddaa 100644 --- a/src/static/js/page/admin.js +++ b/src/static/js/page/admin.js @@ -22,11 +22,14 @@ $(document).ready(function() { $("#tabcontrol-tab-1-2").click(function(){ ccn_tabcontrol_SwitchTab(1, 2); }); + $("#tabcontrol-tab-1-3").click(function(){ + ccn_tabcontrol_SwitchTab(1, 3); + }); ccn_tabcontrol_SwitchTab(1, 1); // load user tab according to admin status if(!ccn_api_common_isAdmin()) - $('#tabcontrol-tab-1-2').hide(); + $('#tabcontrol-tab-1-3').hide(); // apply i18n ccn_i18n_LoadLanguage(); diff --git a/src/static/js/page/calendar.js b/src/static/js/page/calendar.js index 1b81b02..652e230 100644 --- a/src/static/js/page/calendar.js +++ b/src/static/js/page/calendar.js @@ -108,6 +108,7 @@ function ccn_calendar_calendar_Analyse() { day: gottenDateTime.getDate(), dayOfWeek: gottenDateTime.getWeekday() + 1, subcalendar: "", + isCurrentMonth: (gottenDateTime.getMonth() + 1) == gottenMonth, events: new Array() }); gottenDateTime.setTime(gottenDateTime.getTime() + ccn_datetime_DAY1_SPAN * 60000); @@ -205,6 +206,8 @@ function ccn_calendar_calendar_Render() { var lenEvents = item.events.length; var eventsCounter = 0; + $('#ccn-calendarItem-' + i + '-' + j).attr('isCurrentMonth', item.isCurrentMonth ? 'true' : 'false'); + $('#ccn-calendarItem-title-' + i + '-' + j).text(item.day); $('#ccn-calendarItem-desc-' + i + '-' + j).text(item.subcalendar); @@ -216,7 +219,9 @@ function ccn_calendar_calendar_Render() { } if (lenEvents > 4) { // more than 4 item, write number - $('#ccn-calendarItem-task-' + i + '-' + j).text(lenEvents.toString()); + $('#ccn-calendarItem-task-' + i + '-' + j).text( + $.i18n.prop('ccn-i18n-calendar-calendar-stripedEvents').format(lenEvents.toString()) + ); } else { // otherwise, wipe out number $('#ccn-calendarItem-task-' + i + '-' + j).html(' '); diff --git a/src/static/js/template.js b/src/static/js/template.js index cf0ee57..2ef0736 100644 --- a/src/static/js/template.js +++ b/src/static/js/template.js @@ -9,6 +9,7 @@ var ccn_template_displaySharedItem = undefined; var ccn_template_userItem = undefined; var ccn_template_todoItem = undefined; var ccn_template_optionItem = undefined; +var ccn_template_tokenItem = undefined; function ccn_template_Load() { $.ajax({ @@ -84,6 +85,14 @@ function ccn_template_Load() { ccn_template_userItem = $.templates(data); } }); + $.ajax({ + url: $("#jsrender-tmpl-tokenItem").attr('src'), + type: "GET", + async: false, + success: function (data) { + ccn_template_tokenItem = $.templates(data); + } + }); break; case ccn_pages_enumPages.login: break; diff --git a/src/static/js/utils.js b/src/static/js/utils.js index 0ffe3eb..4a47a11 100644 --- a/src/static/js/utils.js +++ b/src/static/js/utils.js @@ -30,14 +30,6 @@ function IsResponseOK(data) { return true; } -function GetApiToken() { - return ccn_localstorageAssist_Get('ccn-token', ''); -} - -function SetApiToken(value) { - ccn_localstorageAssist_Set('ccn-token', value); -} - function LineBreaker2Br(strl) { return $('
').text(strl).html().replace(/\n/g, '
'); } diff --git a/src/static/tmpl/tokenItem.tmpl b/src/static/tmpl/tokenItem.tmpl new file mode 100644 index 0000000..6f109fc --- /dev/null +++ b/src/static/tmpl/tokenItem.tmpl @@ -0,0 +1,20 @@ +
+
+ {{>token}} + {{if isMe}} +

+ {{/if}} +

+ + {{>ua}} +

+

+ + {{>ip}} +

+
+ +
+ +
+
\ No newline at end of file diff --git a/src/templates/admin.html b/src/templates/admin.html index 7a65618..7980520 100644 --- a/src/templates/admin.html +++ b/src/templates/admin.html @@ -14,6 +14,7 @@ + @@ -36,28 +37,41 @@
  • +
  • -
    - -
    -
    - -
    -
    - - - -
    +

    +
    +
    + +
    +
    +

    +

    +
    + + + +
    + +
    +
    +
    + +

    diff --git a/src/templates/calendar.html b/src/templates/calendar.html index cada485..02ccd2d 100644 --- a/src/templates/calendar.html +++ b/src/templates/calendar.html @@ -51,6 +51,12 @@
    @@ -98,7 +109,7 @@
    -
    +
    @@ -112,7 +123,32 @@
    - +
    + +
    +
    + +
    +
    +
    +
    + +
    +
    + +
    +
    +