Merge branch 'master' of https://github.com/ceee/zero

zero.Core/Api/ApiScope.cs

@@ -20,6 +20,11 @@ namespace zero.Core.Api
         return true;
       }
 
+      if (appId.IsNullOrWhiteSpace())
+      {
+        return false;
+      }
+
       if (IncludeShared && appId.Equals(Constants.Database.SharedAppId, StringComparison.OrdinalIgnoreCase))
       {
         return true;

zero.Core/Api/BackofficeApi.cs

@@ -115,6 +115,12 @@ namespace zero.Core.Api
         }
       }
 
+      // set app id
+      if (appAwareEntity != null && appAwareEntity.AppId.IsNullOrEmpty())
+      {
+        appAwareEntity.AppId = Scope.AppId; // Constants.Database.SharedAppId; // TODO correct app id
+      }
+
       // check if current app id is valid
       if (!model.Id.IsNullOrEmpty() && Scope.IsAppAware && appAwareEntity != null)
       {
@@ -170,11 +176,6 @@ namespace zero.Core.Api
           zeroEntity.CreatedDate = DateTimeOffset.Now;
         }
 
-        if (appAwareEntity != null && appAwareEntity.AppId.IsNullOrEmpty())
-        {
-          appAwareEntity.AppId = Scope.AppId; // Constants.Database.SharedAppId; // TODO correct app id
-        }
-
         if (model is ILanguageAwareEntity)
         {
           (model as ILanguageAwareEntity).LanguageId = "languages.1-A"; // TODO correct language id

zero.Web.UI/App/components/forms/check-list.vue

@@ -0,0 +1,119 @@
+ <template>
+  <div class="ui-check-list" :class="{'is-disabled': disabled }">
+    <label v-for="item in list" class="ui-native-check ui-check-list-item">
+      <input type="checkbox" :checked="isChecked(item)" @input="onChange(item)" />
+      <span class="ui-native-check-toggle"></span>
+      {{item.name}}
+    </label>
+  </div>
+</template>
+
+
+<script>
+  import { map as _map, filter as _filter } from 'underscore';
+
+  export default {
+    name: 'uiCheckList',
+
+    props: {
+      value: {
+        type: Array,
+        default: () => []
+      },
+      items: {
+        type: [Array, Function, Promise],
+        required: true
+      },
+      disabled: {
+        type: Boolean,
+        default: false
+      },
+      maxItems: {
+        type: Number,
+        default: 100
+      },
+      reverse: {
+        type: Boolean,
+        default: false
+      }
+    },
+
+
+    data: () => ({
+      list: []
+    }),
+
+
+    watch: {
+      items()
+      {
+        this.init();
+      }
+    },
+
+
+    mounted()
+    {
+      this.init();
+    },
+
+
+    methods: {
+
+      init()
+      {
+        if (typeof this.items === 'function')
+        {
+          this.items().then(res =>
+          {
+            this.list = res;
+          });
+        }
+        else
+        {
+          this.list = JSON.parse(JSON.stringify(this.items));
+        }
+      },
+
+      isChecked(item)
+      {
+        let index = this.value.indexOf(item.id);
+        return (!this.reverse && index > -1) || (this.reverse && index < 0);
+      },
+
+      onChange(item)
+      {
+        let index = this.value.indexOf(item.id);
+        let value = JSON.parse(JSON.stringify(this.value));
+
+        if (index < 0)
+        {
+          value.push(item.id);
+        }
+        else
+        {
+          value.splice(index, 1);
+        }
+
+        this.$emit('input', value);
+      },
+    }
+  }
+</script>
+
+<style lang="scss">
+  .ui-check-list
+  {
+    
+  }
+
+  .ui-check-list-item
+  {
+    display: block;
+
+    & + .ui-check-list-item
+    {
+      margin-top: 14px;
+    }
+  }
+</style>

zero.Web.UI/App/editor/editor-component.vue

@@ -1,6 +1,6 @@
 <template>
   <ui-property v-if="fulfillsCondition" :field="config.field" :label="label" :description="description" :required="config.required" :class="classList" :is-text="view === 'output'">
-    <component v-if="fieldComponent" :is="fieldComponent" :config="config" :value="model" @input="onChange" :meta="meta" />
+    <component v-if="fieldComponent" :is="fieldComponent" :config="config" :value="model" @input="onChange" :meta="meta" :disabled="config.disabled" />
     <p v-if="config.helpText" class="ui-property-help" v-localize="config.helpText"></p>
   </ui-property>
 </template>

zero.Web.UI/App/editor/editor.vue

@@ -6,8 +6,7 @@
       </ui-tab>
     </ui-tabs>
     <aside v-if="!nested && infos && infos != 'none'" class="editor-infos">
-      
-      <div class="ui-box editor-active-toggle" :class="{'is-active': value.isActive }">
+      <div class="ui-box editor-active-toggle" v-if="isShared || activeToggle" :class="{'is-active': value.isActive }">
         <slot name="settings">
           <div v-if="isShared" class="editor-global-flag">
             <b>This entity is shared</b> and can be used by all applications.<br>
@@ -17,6 +16,7 @@
           <ui-property v-if="activeToggle" label="@ui.active" :is-text="true" class="is-toggle">
             <ui-toggle v-model="value.isActive" class="is-primary" />
           </ui-property>
+          <slot name="settings-after"></slot>
         </slot>
       </div>
       <div class="ui-box is-light is-connected">
@@ -139,7 +139,7 @@
 
         this.hasTabs = this.tabs.length > 0 && !this.nested;
 
-        if (!this.tabs.length)
+        if (this.tabs.length < 1)
         {
           this.tabs.push({
             label: '',

zero.Web.UI/App/editor/fields/checklist.vue

@@ -0,0 +1,15 @@
+<template>
+  <ui-check-list :value="value" @input="$emit('input', $event)" :reverse="config.reverse" :items="config.items" />
+</template>
+
+<script>
+  export default {
+    props: {
+      value: {
+        type: Array,
+        default: () => []
+      },
+      config: Object
+    },
+  }
+</script>

zero.Web.UI/App/editor/fields/toggle.vue

@@ -1,5 +1,5 @@
 <template>
-  <ui-toggle :value="value" @input="$emit('input', $event)" />
+  <ui-toggle :value="value" @input="$emit('input', $event)" :disabled="disabled" />
 </template>
 
 
@@ -9,7 +9,12 @@
       value: {
         type: Boolean,
         default: false
-      }
+      },
+      disabled: {
+        type: Boolean,
+        default: false
+      },
+      config: Object
     }
   }
 </script>

zero.Web.UI/Sass/Core/_forms.scss

@@ -73,4 +73,70 @@ textarea
     height: 42px;
     line-height: 40px;
   }
+}
+
+.ui-native-check
+{
+  position: relative;
+  top: 1px;
+  font-size: var(--font-size);
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  line-height: 1;
+
+  input
+  {
+    width: 0;
+    height: 0;
+    opacity: 0;
+    position: absolute;
+    left: 0;
+    overflow: hidden;
+    visibility: hidden;
+    -webkit-appearance: none;
+    border: none;
+  }
+
+  &.is-primary input:checked ~ .ui-native-check-toggle
+  {
+    background: var(--color-primary);
+
+    &:before
+    {
+      color: var(--color-primary-fg);
+    }
+  }
+}
+
+.ui-native-check-toggle
+{
+  display: inline-block;
+  width: 20px;
+  height: 20px;
+  line-height: 20px;
+  text-align: center;
+  border-radius: var(--radius);
+  background: var(--color-bg-mid);
+  margin-right: 10px;
+  position: relative;
+  top: -1px;
+
+  &:before
+  {
+    content: "\e83f";
+    @extend %font-icon;
+    color: transparent;
+    font-size: var(--font-size-xs);
+  }
+
+  input:checked ~ &
+  {
+    background: var(--color-secondary);
+
+    &:before
+    {
+      color: var(--color-secondary-fg);
+    }
+  }
 }

zero.Web.UI/Sass/Core/_settings.scss

@@ -5,7 +5,7 @@
   --color-primary: rgb(44, 162, 212); //linear-gradient(75deg, #48da9c, #3eb8ad); //#484c5b; // #292b2c; // #00aea2
   --color-primary-fg: #fff;
   --color-primary-low: rgba(44, 162, 212, 0.15);
-  --color-secondary: #484d60;
+  --color-secondary: #353842;
   --color-secondary-fg: #fff;
   --color-primary-two: #3d72c4;
   --color-negative: #d82853;