@things-factory/operato-mms 7.0.1-alpha.4 → 7.0.1-alpha.40

package/_index.html

@@ -52,6 +52,7 @@
     <!-- Performance tip: hint to the browser to start the handshake for the fonts site -->
     <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin />
     <link href="/node_modules/@material-design-icons/font/index.css" rel="stylesheet" />
+    <link href="/node_modules/material-symbols/index.css" rel="stylesheet" />
     <style>
       body {
         margin: 0;
@@ -96,12 +97,7 @@
     <script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
     <script src="/node_modules/web-animations-js/web-animations-next.min.js"></script>
     <script src="/node_modules/@hatiolab/things-scene/things-scene-min.js"></script>
-    <script
-      type="text/javascript"
-      src="//laz-g-cdn.alicdn.com/sj/securesdk/0.0.3/securesdk_lzd_v1.js"
-      id="J_secure_sdk_v2"
-      data-appkey="120961"
-    ></script>
+    <script type="text/javascript" src="//laz-g-cdn.alicdn.com/sj/securesdk/0.0.3/securesdk_lzd_v1.js" id="J_secure_sdk_v2" data-appkey="120961"></script>
     <!-- Built with love using PWA Starter Kit -->
   </body>
 </html>

package/client/bootstrap.js

@@ -60,7 +60,7 @@ export default async function bootstrap() {
   store.dispatch({
     type: ADD_MORENDA,
     morenda: {
-      icon: html` <mwc-icon>settings</mwc-icon> `,
+      icon: html` <md-icon>settings</md-icon> `,
       name: html` <ox-i18n msgid="label.setting"></ox-i18n> `,
       action: () => {
         navigate('setting')
@@ -69,13 +69,11 @@ export default async function bootstrap() {
   })
 
   /* add addon-menu management page morenda */
-  if (
-    await hasPrivilege({ privilege: 'mutation', category: 'menu', domainOwnerGranted: true, superUserGranted: true })
-  ) {
+  if (await hasPrivilege({ privilege: 'mutation', category: 'menu', domainOwnerGranted: true, superUserGranted: true })) {
     store.dispatch({
       type: ADD_MORENDA,
       morenda: {
-        icon: html` <mwc-icon>view_list</mwc-icon> `,
+        icon: html` <md-icon>view_list</md-icon> `,
         name: html` <ox-i18n msgid="text.addon-menu management"></ox-i18n> `,
         action: () => {
           navigate('addon-menu-setting')
@@ -104,7 +102,7 @@ export default async function bootstrap() {
   store.dispatch({
     type: ADD_MORENDA,
     morenda: {
-      icon: html` <mwc-icon>help</mwc-icon> `,
+      icon: html` <md-icon>help</md-icon> `,
       name: html` <ox-i18n msgid="text.help"></ox-i18n> `,
       action: () => {
         navigate('help')
@@ -143,7 +141,7 @@ export default async function bootstrap() {
   store.dispatch({
     type: ADD_MORENDA,
     morenda: {
-      icon: html` <mwc-icon>device_hub</mwc-icon> `,
+      icon: html` <md-icon>device_hub</md-icon> `,
       name: html` <ox-i18n msgid="text.connection"></ox-i18n> `,
       action: () => {
         navigate('connection')
@@ -154,7 +152,7 @@ export default async function bootstrap() {
   store.dispatch({
     type: ADD_MORENDA,
     morenda: {
-      icon: html` <mwc-icon>format_list_numbered</mwc-icon> `,
+      icon: html` <md-icon>format_list_numbered</md-icon> `,
       name: html` <ox-i18n msgid="text.scenario"></ox-i18n> `,
       action: () => {
         navigate('scenario')

package/client/pages/catalogue/products.js

@@ -1,6 +1,7 @@
 import { getCodeByName } from '@things-factory/code-base'
 import '@things-factory/form-ui'
 import '@operato/data-grist'
+import '@operato/oops'
 import { i18next, localize } from '@things-factory/i18n-base'
 import { openPopup } from '@operato/layout'
 import { client, PageView } from '@things-factory/shell'
@@ -73,14 +74,9 @@ class Products extends localize(i18next)(PageView) {
 
     return html`
       <search-form id="search-form" .fields=${this._searchFields} @submit=${e => this.dataGrist.fetch()}></search-form>
-      <ox-grist
-        .mode=${isMobileDevice() ? 'LIST' : 'GRID'}
-        .config=${this.config}
-        .fetchHandler="${this._fetchProducts.bind(this)}"
-      >
-      </ox-grist>
+      <ox-grist .mode=${isMobileDevice() ? 'LIST' : 'GRID'} .config=${this.config} .fetchHandler="${this._fetchProducts.bind(this)}"> </ox-grist>
 
-      <oops-progress
+      <ox-oops-progress
         .tag=${tag}
         @progress=${e => {
           this.progress = e.detail
@@ -96,7 +92,7 @@ class Products extends localize(i18next)(PageView) {
           <mwc-linear-progress .progress=${progress / 100}></mwc-linear-progress>
           <span>Synchronising products : ${progress} % (${message})</span>
         </div>
-      </oops-progress>
+      </ox-oops-progress>
     `
   }
 
@@ -367,9 +363,7 @@ class Products extends localize(i18next)(PageView) {
           ...this._columns
             .filter(column => column.type !== 'gutter' && column.record !== undefined && column.imex !== undefined)
             .reduce((record, column) => {
-              record[column.imex.key] = column.imex.key
-                .split('.')
-                .reduce((obj, key) => (obj && obj[key] !== 'undefined' ? obj[key] : undefined), item)
+              record[column.imex.key] = column.imex.key.split('.').reduce((obj, key) => (obj && obj[key] !== 'undefined' ? obj[key] : undefined), item)
               return record
             }, {})
         }

package/client/pages/catalogue/warehouse-marketplace-auto-link-popup.js

@@ -1,4 +1,5 @@
 import '@things-factory/form-ui'
+import '@operato/oops'
 import { i18next, localize } from '@things-factory/i18n-base'
 import { client } from '@things-factory/shell'
 import { ScrollbarStyles } from '@things-factory/styles'
@@ -131,13 +132,9 @@ class WarehouseMarketplaceAutoLinkPopup extends localize(i18next)(LitElement) {
       </ul>
 
       <div class="button-container">
-        <mwc-button
-          raised
-          @click=${this.autoLinkWarehouseMarketplaceProduct}
-          label="${i18next.t('button.link_product')}"
-        ></mwc-button>
+        <mwc-button raised @click=${this.autoLinkWarehouseMarketplaceProduct} label="${i18next.t('button.link_product')}"></mwc-button>
       </div>
-      <oops-progress
+      <ox-oops-progress
         .tag=${tag}
         @progress=${e => {
           this.progress = e.detail
@@ -152,7 +149,7 @@ class WarehouseMarketplaceAutoLinkPopup extends localize(i18next)(LitElement) {
           <mwc-linear-progress .progress=${progress / 100}></mwc-linear-progress>
           <span>Linking Warehouse Products : ${progress} % (${message})</span>
         </div>
-      </oops-progress>
+      </ox-oops-progress>
     `
   }
 
@@ -178,10 +175,7 @@ class WarehouseMarketplaceAutoLinkPopup extends localize(i18next)(LitElement) {
       const response = await client.query({
         query: gql`
           mutation ($marketplaceStoreIds: [String]!, $isCheckedSku: Boolean!) {
-            autoLinkWarehouseMarketplaceProductVariations(
-              marketplaceStoreIds: $marketplaceStoreIds
-              isCheckedSku: $isCheckedSku
-            )
+            autoLinkWarehouseMarketplaceProductVariations(marketplaceStoreIds: $marketplaceStoreIds, isCheckedSku: $isCheckedSku)
           }
         `,
         variables: {

package/client/themes/app-theme.css

@@ -82,15 +82,28 @@ body {
   --mdc-button-outline-width: 1px;
   --mdc-button-horizontal-padding: 16px;
 
+  --md-fab-container-color: var(--primary-color);
+  --md-fab-icon-color: var(--focus-color);
+
+  --md-theme-on-primary: var(--theme-white-color);
+  --md-theme-primary: var(--secondary-text-color);
+  --md-theme-on-secondary: var(--theme-white-color);
+  --md-theme-secondary: var(--primary-color);
+  --md-button-outline-color: var(--primary-color);
+  --md-danger-button-primary-color: var(--status-danger-color);
+  --md-danger-button-outline-color: var(--status-danger-color);
+  --md-button-outline-width: 1px;
+  --md-button-horizontal-padding: 16px;
+
   /* button style */
   --button-background-color: #fafbfc;
   --button-background-focus-color: var(--primary-color);
   --button-border: var(--border-dark-color);
   --button-border-radius: var(--border-radius);
   --button-margin: var(--margin-default) var(--margin-default) var(--margin-default) 0;
-  --button-padding: var(--padding-default);
+  --button-padding: calc(var(--padding-narrow) * 1.5) var(--padding-wide);
   --button-color: var(--secondary-color);
-  --button-font: normal 15px var(--theme-font);
+  --button-font: 600 var(--fontsize-default) var(--theme-font);
   --button-text-transform: capitalize;
 
   --button-active-background-color: var(--status-success-color);
@@ -134,7 +147,7 @@ body {
   --label-color: var(--secondary-color);
   --label-text-transform: capitalize;
   --input-margin: var(--margin-narrow) 0;
-  --input-padding: var(--padding-default);
+  --input-padding: 6px 2px;
   --input-min-width: 200px;
   --input-font: normal var(--fontsize-default) var(--theme-font);
   --input-hint-font: normal var(--fontsize-small) var(--theme-font);

package/client/themes/grist-theme.css

@@ -36,6 +36,8 @@ body {
   --grid-header-filter-title-font: normal 12px var(--theme-font);
   --grid-header-filter-title-icon-color: var(--primary-color);
 
+  --grid-body-bottom-border: 1px solid rgba(var(--secondary-color-rgb), 0.2);
+
   --grid-gutter-padding: var(--padding-default) 0;
 
   --grid-record-background-color: var(--theme-white-color);
@@ -143,7 +145,7 @@ body {
   --record-view-footer-button-border-width: 0 0 0 1px;
   --record-view-footer-button-font: 17px;
   --record-view-footer-button-color: var(--theme-white-color);
-  --record-view-footer-iconbutton-size: 35px;
+  --record-view-footer-iconbutton-size: 28px;
   --record-view-footer-focus-background: var(--primary-color);
 
   --ox-grist-padding: var(--padding-default) var(--padding-default) 0 var(--padding-default);