ru.coon 2.7.50 → 2.7.52

package/src/common/panel/SelectIconClassPanel.scss

@@ -1,38 +1,38 @@
-.SelectIconClassPanel {
-    .x-btn-default-small {
-        background-color: transparent;
-        padding: 2px;
-        border-color: lightgray;
-    }
-    .x-btn-icon-el-default-small {
-        display: flex;
-        align-items: center;
-        
-        justify-content: center;
-        min-height: 26px;
-        min-width: 26px;
-    }
-    .svg-icon {
-        background-color: $base-color;
-    }
-    .x-table-layout {
-        padding-left: 16px;
-    }
-    .x-autocontainer-innerCt {
-        display: grid;
-        grid-template-columns: 1fr 1fr 1fr 1fr;
-        gap: 12px;
-        grid-auto-rows: min-content;
-    }
-    .icon-pack-grid-btn {
-        .x-btn-button-default-small {
-            display: grid;
-            grid-template-columns: 24px 1fr 24px;
-            align-items: center;
-        }
-    }
-    .icon-pack-search {
-        display: flex;
-        align-items: center;
-    }
-}
+.SelectIconClassPanel {
+    .x-btn-default-small {
+        background-color: transparent;
+        padding: 2px;
+        border-color: lightgray;
+    }
+    .x-btn-icon-el-default-small {
+        display: flex;
+        align-items: center;
+        
+        justify-content: center;
+        min-height: 26px;
+        min-width: 26px;
+    }
+    .svg-icon {
+        background-color: $base-color;
+    }
+    .x-table-layout {
+        padding-left: 16px;
+    }
+    .x-autocontainer-innerCt {
+        display: grid;
+        grid-template-columns: 1fr 1fr 1fr 1fr;
+        gap: 12px;
+        grid-auto-rows: min-content;
+    }
+    .icon-pack-grid-btn {
+        .x-btn-button-default-small {
+            display: grid;
+            grid-template-columns: 24px 1fr 24px;
+            align-items: center;
+        }
+    }
+    .icon-pack-search {
+        display: flex;
+        align-items: center;
+    }
+}

package/src/common/panel/SelectIconClassPanelTemplate.scss

@@ -1,14 +1,14 @@
-.SelectIconClassPanelTemplate {
-    .coon-icon-message {
-        .x-form-display-field.x-form-display-field-default {
-            font-size: 22px;
-            width: 90%;
-            line-height: 1.2;
-            margin: 24px;
-        }
-    }
-
-    .x-autocontainer-innerCt:has(.coon-icon-message) {
-        display: block,
-    }
-}
+.SelectIconClassPanelTemplate {
+    .coon-icon-message {
+        .x-form-display-field.x-form-display-field-default {
+            font-size: 22px;
+            width: 90%;
+            line-height: 1.2;
+            margin: 24px;
+        }
+    }
+
+    .x-autocontainer-innerCt:has(.coon-icon-message) {
+        display: block,
+    }
+}

package/src/common/panel/StopwatchWindow.js

@@ -0,0 +1,147 @@
+Ext.define('Coon.common.panel.StopwatchWindow', {
+    extend: 'Ext.window.Window',
+    xtype: 'stopwatch-window',
+    alternateClassName: [
+        'SigmaUtilities.view.multithreadprocess.StopwatchWindow'
+    ],
+    cls: 'StopwatchWindow',
+    bodyPadding: 0,
+    layout: {
+        type: 'vbox',
+        align: 'stretch',
+    },
+    config: {
+        jobId: undefined,
+    },
+    viewModel: {
+        data: {
+            isJobComplete: false,
+            withErrors: false,
+        },
+        formulas: {
+            titleFormula: {
+                get: function(data) {
+                    return data('isJobComplete') ? 'Операция завершена': 'Массовая операция выполняется';
+                },
+            },
+            statusIcon: {
+                get: function(data) {
+                    const loader = `<span class="loader"></span>`;
+                    const successfully = `<span class="svg-icon svg-icon-process-approval svg-icon-size-48 svg-icon-color-green"></span>`;
+                    const failed = `<span class="svg-icon svg-icon-attention-critical svg-icon-size-48 svg-icon-color-red"></span>`;
+
+                    return data('isJobComplete') ?
+                        data('withErrors') ? failed: successfully:
+                        loader;
+                },
+            },
+        },
+    },
+    title: 'Запущена массовая операция',
+    bind: {
+        title: '{titleFormula}',
+    },
+    height: 270,
+    width: 400,
+    modal: true,
+    closable: false,
+    resizable: false,
+    draggable: false,
+    closeAction: 'destroy',
+    buttonAlign: 'center',
+    showTimer: true,
+    items: [
+        {
+            xtype: 'container',
+            itemId: 'stopwatch-window-mask-target',
+            height: 100,
+            layout: 'fit',
+            style: {
+                display: 'flex',
+                justifyContent: 'center',
+            },
+            bind: {
+                html: '<div class="status-icon-container">{statusIcon}</div>',
+            },
+        },
+        {
+            xtype: 'UniversalUploadResults',
+            itemId: 'UniversalUploadResults',
+            flex: 1,
+            data: {
+                header: 'Выполнено операций',
+                result: {},
+            },
+        }
+    ],
+    constructor: function(config) {
+        const buttons = [
+            {
+                xtype: 'button',
+                ui: 'green-button',
+                text: 'Перейти к МО',
+                bind: {
+                    hidden: '{!isJobComplete}',
+                },
+                handler: this.showDetails.bind(this),
+            },
+            {
+                xtype: 'button',
+                ui: 'orange-button',
+                text: 'Закрыть',
+                bind: {
+                    hidden: '{!isJobComplete}',
+                },
+                handler: (btn) => {
+                    btn.up('window').close();
+                },
+            }
+        ];
+
+        Ext.apply(this, {
+            buttons: Ext.Array.merge(
+                (Array.isArray(config.buttons)) ? config.buttons: [],
+                buttons
+            ),
+        }, config);
+        this.self.superclass['constructor'].apply(this);
+    },
+    setProcessInfo: function(data) {
+        if (data.jobComplete) {
+            this.getViewModel().set('isJobComplete', true);
+            this.getViewModel().set('withErrors', data.errorsCount > 0);
+        }
+        this.down('UniversalUploadResults').setData({
+            header: 'Выполнено операций',
+            result: this.mapResults(data),
+        });
+    },
+    mapResults: function(data = {}) {
+        const mapping = {
+            completeCount: 'successCount',
+            errorsCount: 'errorCount',
+        };
+        const mapped = Ext.clone(data);
+        Object.keys(data).map((key) => {
+            if (mapping[key]) {
+                mapped[mapping[key]] = data[key];
+            }
+        });
+        return mapped;
+    },
+
+    showDetails: function() {
+        if (!this.getJobId()) {
+            Coon.log.warn('Нет идентификатора МО для просмотра деталей');
+            return;
+        }
+        const panel = Ext.widget('BPViewPanel');
+        const window = Ext.widget('WindowWrap', {
+            items: panel,
+            maximized: true,
+            closeAction: 'close',
+        });
+        window.show();
+        panel.getController().doInit(this.getJobId(), false);
+    },
+});

package/src/common/panel/StopwatchWindow.scss

@@ -0,0 +1,44 @@
+.StopwatchWindow {
+  .svg-icon-size-48 {
+    min-height: 48px !important;
+    min-width: 48px !important;
+    mask-size: 48px;
+  }
+  .svg-icon-color-green {
+    background-color: rgba(82, 148, 100, 1);
+  }
+  .svg-icon-color-red {
+    background-color: rgba(211, 71, 62, 1);
+  }
+  .status-icon-container {
+    display: flex;
+    align-items: center;
+    padding-top: 20px;
+  }
+
+  .loader {
+    width: 48px;
+    padding: 5px;
+    aspect-ratio: 1;
+    border-radius: 50%;
+    background: #3D6780;
+    --_m:
+            conic-gradient(#0000 10%,#000),
+            linear-gradient(#000 0 0) content-box;
+    -webkit-mask: var(--_m);
+    mask: var(--_m);
+    -webkit-mask-composite: source-out;
+    mask-composite: subtract;
+    animation: spin 1s infinite linear;
+  }
+
+}
+@keyframes spin {
+  0% {
+    transform: rotate(0);
+  }
+
+  100% {
+    transform: rotate(360deg);
+  }
+}

package/src/common/panel/UniversalUploadResults.js

@@ -0,0 +1,31 @@
+Ext.define('Coon.common.panel.UniversalUploadResults', {
+    extend: 'Ext.Component',
+    xtype: 'UniversalUploadResults',
+    alias: 'widget.UniversalUploadResults',
+    alternateClassName: [
+        'SigmaUtilities.view.multithreadprocess.UniversalUploadResults'
+    ],
+    cls: 'UniversalUploadResults',
+    config: {
+        data: {
+            header: undefined,
+            result: {},
+        },
+    },
+    layout: 'fit',
+    tpl: new Ext.XTemplate(
+        '<div class="main-container">',
+        ' <div class="header"> {header} </div>',
+        ' <div class="results">',
+        '   <span class="result-item"> Успешно: <span class="good-result">{result.successCount}</span> </span>',
+        '   <span class="result-item"> C ошибкой: <span class="error-result">{result.errorCount}</span> </span>',
+        '   <span class="result-item"> Всего: <span class="total-result">{result.totalCount}</span> </span>',
+        ' </div> ',
+        ' <div class="messages">',
+        '   <tpl for="values.result.messages">',
+        '     {.}<br>',
+        '   </tpl>',
+        ' </div>',
+        '</div>'
+    ),
+});

package/src/common/panel/UniversalUploadResults.scss

@@ -0,0 +1,40 @@
+.UniversalUploadResults {
+  .main-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+    margin-bottom: 20px;
+  }
+
+  .results,
+  .messages {
+    margin-bottom: 5px;
+  }
+
+  .header {
+    text-align: center;
+    line-height: 20px;
+  }
+
+  .results {
+    line-height: 20px;
+    .result-item {
+      margin-left: 10px;
+      margin-right: 10px;
+
+      .good-result {
+        font-weight: normal;
+        color: rgba(82, 148, 100, 1);
+      }
+      .error-result {
+        font-weight: normal;
+        color: rgba(211, 71, 62, 1);
+      }
+      .total-result {
+        font-weight: normal;
+      }
+    }
+  }
+}

package/src/common/panel/WindowWrap.scss

@@ -1,9 +1,9 @@
-.window-wrap {
-
-  &.coon-mobile {
-    .x-title-text {
-        white-space: normal;
-    }
-  }
-
+.window-wrap {
+
+  &.coon-mobile {
+    .x-title-text {
+        white-space: normal;
+    }
+  }
+
 }

package/src/common/panel/dropzone/UniversalMultiUploadForm.scss

@@ -1,29 +1,29 @@
-.overItemCls {
-  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.5)
-}
-.universalmultiuploadform {
-  .files-container {
-    width: 100%;
-    height: 100%;
-    border: 1px dashed lightgray;
-    display: flex;
-    padding: 2px;
-    flex-wrap: wrap;
-    align-content: flex-start;
-    .file-name-container {
-      width: 100%;
-      font-size: 10px;
-    }
-  }
-
-  .file-item {
-    display: flex;
-    width: 100px;
-    height: 100px;
-    padding: 5px;
-    flex-direction: column;
-    justify-content: flex-start;
-    align-items: center;
-    overflow: hidden;
-  }
-}
+.overItemCls {
+  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.5)
+}
+.universalmultiuploadform {
+  .files-container {
+    width: 100%;
+    height: 100%;
+    border: 1px dashed lightgray;
+    display: flex;
+    padding: 2px;
+    flex-wrap: wrap;
+    align-content: flex-start;
+    .file-name-container {
+      width: 100%;
+      font-size: 10px;
+    }
+  }
+
+  .file-item {
+    display: flex;
+    width: 100px;
+    height: 100px;
+    padding: 5px;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: center;
+    overflow: hidden;
+  }
+}

package/src/common/panel/dropzone/UploadDropZone.scss

@@ -1,36 +1,36 @@
-$dropzone-background: #f9f9fb;
-
-.drop-zone-dragover div.drop-zone-container {
-    border: 1px dotted red;
-    background-color: lightgreen !important;
-}
-
-.drop-zone-container {
-    width: 100%;
-    height: 100px;
-    background: $dropzone-background;
-    cursor: pointer;
-    display: flex;
-
-.drop-zone {
-        border: 1px dotted black;
-        display: flex;
-        flex-grow: 1;
-        align-items: center;
-        justify-content: center;
-        .icon-upload {
-          font-size:40px;
-          margin-right: 20px
-        }
-    }
-.file-input {
-        position: absolute;
-        width: 100%;
-        height: 100%;
-        top: 0;
-        left: 0;
-        opacity: 0;
-        cursor: pointer;
-        visibility: revert;
-    }
-}
+$dropzone-background: #f9f9fb;
+
+.drop-zone-dragover div.drop-zone-container {
+    border: 1px dotted red;
+    background-color: lightgreen !important;
+}
+
+.drop-zone-container {
+    width: 100%;
+    height: 100px;
+    background: $dropzone-background;
+    cursor: pointer;
+    display: flex;
+
+.drop-zone {
+        border: 1px dotted black;
+        display: flex;
+        flex-grow: 1;
+        align-items: center;
+        justify-content: center;
+        .icon-upload {
+          font-size:40px;
+          margin-right: 20px
+        }
+    }
+.file-input {
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        top: 0;
+        left: 0;
+        opacity: 0;
+        cursor: pointer;
+        visibility: revert;
+    }
+}