@tripup-company/element-ui-extended 0.0.74 → 0.0.77

package/src/components/NewField/index.vue

@@ -4,16 +4,44 @@
       <slot class="editable-cell__text__slot">
         <el-col :span="24">
           <el-checkbox v-if="type === 'checkbox'" v-model="dataModel" />
-          <el-select v-else-if="type === 'select'" v-model="dataModel" :filterable="filterable" :loading="loading" :remote="remote" :remote-method="remoteMethodHandler" :span="24" clearable placeholder="Select" :multiple="selectMultiple" class="w-100">
+          <el-select
+            v-else-if="type === 'select'"
+            v-model="dataModel"
+            :filterable="filterable"
+            :loading="loading"
+            :remote="remote"
+            :remote-method="remoteMethodHandler"
+            :span="24"
+            clearable
+            placeholder="Select"
+            :multiple="selectMultiple"
+            :value-key="objectValueKey"
+            class="w-100"
+          >
             <el-option
               v-for="item in selectListLocal"
               :key="item[selectKey]"
               :label="item[selectLabel]"
-              :value="item[selectValue]"
+              :value="selectJson ? item : item[selectValue]"
             />
           </el-select>
-          <el-date-picker v-else-if="type === 'date-picker'" v-model="dataModel" format="dd.MM.yyyy" value-format="yyyy-MM-dd" type="date" placeholder="Pick a day" class="w-100" />
-          <el-input-number v-else-if="type === 'number'" v-model="dataModel" :controls="false" :step="step" :precision="precision" class="w-100" />
+          <el-date-picker
+            v-else-if="type === 'date-picker'"
+            v-model="dataModel"
+            :format="format"
+            :value-format="valueFormat"
+            type="date"
+            placeholder="Pick a day"
+            class="w-100"
+          />
+          <el-input-number
+            v-else-if="type === 'number'"
+            v-model="dataModel"
+            :controls="false"
+            :step="step"
+            :precision="precision"
+            class="w-100"
+          />
           <el-input
             v-else
             v-model="dataModel"
@@ -31,11 +59,11 @@
 import lodash from "lodash";
 const _ = lodash;
 export default {
-  name: 'NewField',
+  name: "NewField",
   props: {
     field: {
       type: [String, Boolean],
-      default: '',
+      default: "",
     },
     filterable: {
       type: Boolean,
@@ -43,15 +71,15 @@ export default {
     },
     value: {
       type: [String, Boolean, Date, Number, Array],
-      default: '',
+      default: "",
     },
     type: {
       type: String,
-      default: 'input',
+      default: "input",
     },
     placeholder: {
       type: String,
-      default: '',
+      default: "",
     },
     selectList: {
       type: Array,
@@ -63,17 +91,25 @@ export default {
       type: Boolean,
       default: false,
     },
+    objectValueKey: {
+      type: String,
+      default: "value",
+    },
+    selectJson: {
+      type: Boolean,
+      default: false,
+    },
     selectKey: {
       type: String,
-      default: '',
+      default: "",
     },
     selectLabel: {
       type: String,
-      default: '',
+      default: "",
     },
     selectValue: {
       type: String,
-      default: '',
+      default: "",
     },
     precision: {
       type: Number,
@@ -87,6 +123,14 @@ export default {
       type: Object,
       default: null,
     },
+    format: {
+      type: String,
+      default: "dd.MM.yyyy",
+    },
+    valueFormat: {
+      type: String,
+      default: "yyyy-MM-dd",
+    },
   },
   data() {
     return {
@@ -111,10 +155,10 @@ export default {
     },
   },
   watch: {
-    dataModel: function() {
-      this.$emit('editable:save', { 'field': this.field, 'value': this.dataModel });
+    dataModel: function () {
+      this.$emit("editable:save", { field: this.field, value: this.dataModel });
     },
-    value: function() {
+    value: function () {
       this.dataModel = _.cloneDeep(this.value);
     },
   },
@@ -124,7 +168,10 @@ export default {
   methods: {
     async remoteCall(query) {
       this.loading = true;
-      const response = await this.remoteMethod.all({ search: this.selectLabel  + ':' +query, searchFields: this.selectLabel + ':like' });
+      const response = await this.remoteMethod.all({
+        search: this.selectLabel + ":" + query,
+        searchFields: this.selectLabel + ":like",
+      });
       this.selectListLocal = response.data;
       this.loading = false;
     },

package/src/components/PartColumn/EditColumn.vue

@@ -17,6 +17,8 @@
             :type="field.selectList ? 'select' : (field.type? field.type :'input')"
             :select-list="field.selectList ? field.selectList : []"
             :select-multiple="field.selectMultiple"
+            :select-json="field.selectJson ? field.selectJson : false"
+            :object-value-key="field.objectValueKey ? field.objectValueKey : 'value'"
             :select-key="field.selectList ? (field.selectKey ? field.selectKey : 'value' ) : ''"
             :select-label="field.selectList ? (field.selectLabel ? field.selectLabel : 'name' ) : ''"
             :select-value="field.selectList ? (field.selectValue ? field.selectValue : 'value' ) : ''"
@@ -24,6 +26,8 @@
             :precision="field.precision ? field.precision : 0"
             :remote-method="field.remoteMethod ? field.remoteMethod : null"
             :filterable="field.filterable ? field.filterable : null"
+            :format="field.format ? field.format : 'dd.MM.yyyy'"
+            :value-format="field.valueFormat ? field.valueFormat : 'yyyy-MM-dd'"
             @editable:save="updateValue"
           />
         </el-form-item>

package/src/components/PartColumn/NewColumn.vue

@@ -16,6 +16,8 @@
             :type="field.selectList ? 'select' : (field.type? field.type :'input')"
             :select-list="field.selectList ? field.selectList : []"
             :select-multiple="field.selectMultiple"
+            :select-json="field.selectJson ? field.selectJson : false"
+            :object-value-key="field.objectValueKey ? field.objectValueKey : 'value'"
             :select-key="field.selectList ? (field.selectKey ? field.selectKey : 'value' ) : ''"
             :select-label="field.selectList ? (field.selectLabel ? field.selectLabel : 'name' ) : ''"
             :select-value="field.selectList ? (field.selectValue ? field.selectValue : 'value' ) : ''"
@@ -23,6 +25,8 @@
             :precision="field.precision ? field.precision : 0"
             :remote-method="field.remoteMethod ? field.remoteMethod : null"
             :filterable="field.filterable ? field.filterable : null"
+            :format="field.format ? field.format : 'dd.MM.yyyy'"
+            :value-format="field.valueFormat ? field.valueFormat : 'yyyy-MM-dd'"
             @editable:save="updateValue"
           />
         </el-form-item>

package/src/repositories/base-repository.ts

@@ -28,7 +28,7 @@ export default abstract class BaseRepository<T> implements Write<T>, Read<T> {
   
   create(item: T): Promise<T> {
     return new Promise<T>((resolve, reject) => {
-      this.request.$request({
+      this.request.request({
         url: this.baseUrl,
         method: 'post',
         data: item,
@@ -42,7 +42,7 @@ export default abstract class BaseRepository<T> implements Write<T>, Read<T> {
 
   update(id: string, item: T, include = "--"): Promise<T> {
     return new Promise<T>((resolve, reject) => {
-      this.request.$request({
+      this.request.request({
         url: this.baseUrl + "/" + id + "?include=" + include,
         method: "patch",
         data: item,
@@ -58,7 +58,7 @@ export default abstract class BaseRepository<T> implements Write<T>, Read<T> {
 
   delete(id: string): Promise<boolean> {
     return new Promise<boolean>((resolve, reject) => {
-      this.request.$request({
+      this.request.request({
         url: this.baseUrl + "/" + id,
         method: "delete",
       })
@@ -73,7 +73,7 @@ export default abstract class BaseRepository<T> implements Write<T>, Read<T> {
 
   findOne(id: string, include = "--"): Promise<T> {
     return new Promise<T>((resolve, reject) => {
-      this.request.$request({
+      this.request.request({
         url: this.baseUrl + "/" + id + "?include=" + include,
         method: "get",
       })
@@ -88,7 +88,7 @@ export default abstract class BaseRepository<T> implements Write<T>, Read<T> {
 
   all(query: string, include = "--", filter = ""): Promise<Collection<T>> {
     return new Promise<Collection<T>>((resolve, reject) => {
-      this.request.$request({
+      this.request.request({
         url: this.baseUrl + "?include=" + include + (filter === "" ? '' : ('&selectFilter=' + filter)),
         method: "get",
         params: query,

package/src/styles/index.scss

@@ -1,218 +1,3 @@
 @import "variables";
 @import 'spacing';
 @import 'editable-field-component';
-
-body {
-  height: 100%;
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
-  text-rendering: optimizeLegibility;
-  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
-}
-
-label {
-  font-weight: 700;
-}
-
-html {
-  height: 100%;
-  box-sizing: border-box;
-}
-
-#app {
-  height: 100%;
-}
-
-*,
-*:before,
-*:after {
-  box-sizing: inherit;
-}
-
-.no-padding {
-  padding: 0px !important;
-}
-
-.padding-content {
-  padding: 4px 0;
-}
-
-a:focus,
-a:active {
-  outline: none;
-}
-
-a,
-a:focus,
-a:hover {
-  cursor: pointer;
-  color: inherit;
-  text-decoration: none;
-}
-
-div:focus {
-  outline: none;
-}
-
-.fr {
-  float: right;
-}
-
-.fl {
-  float: left;
-}
-
-.pr-5 {
-  padding-right: 5px;
-}
-
-.pl-5 {
-  padding-left: 5px;
-}
-
-.block {
-  display: block;
-}
-
-.pointer {
-  cursor: pointer;
-}
-
-.inlineBlock {
-  display: block;
-}
-
-.clearfix {
-  &:after {
-    visibility: hidden;
-    display: block;
-    font-size: 0;
-    content: " ";
-    clear: both;
-    height: 0;
-  }
-}
-
-code {
-  background: #eef1f6;
-  padding: 15px 16px;
-  margin-bottom: 20px;
-  display: block;
-  line-height: 36px;
-  font-size: 15px;
-  font-family: "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
-
-  a {
-    color: #337ab7;
-    cursor: pointer;
-
-    &:hover {
-      color: rgb(32, 160, 255);
-    }
-  }
-}
-
-.warn-content {
-  background: rgba(66, 185, 131, .1);
-  border-radius: 2px;
-  padding: 1rem;
-  line-height: 1.6rem;
-  word-spacing: .05rem;
-
-  a {
-    color: #42b983;
-    font-weight: 600;
-  }
-}
-@media (min-width: $sm){
-  .app-container {
-    padding: 20px;
-  }
-}
-
-.components-container {
-  margin: 30px 50px;
-  position: relative;
-}
-
-.pagination-container {
-  margin-top: 30px;
-}
-
-.text-center {
-  text-align: center
-}
-
-.sub-navbar {
-  height: 50px;
-  line-height: 50px;
-  position: relative;
-  width: 100%;
-  text-align: right;
-  padding-right: 20px;
-  transition: 600ms ease position;
-  background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
-
-  .subtitle {
-    font-size: 20px;
-    color: #fff;
-  }
-
-  &.draft {
-    background: #d0d0d0;
-  }
-
-  &.deleted {
-    background: #d0d0d0;
-  }
-}
-
-.link-type,
-.link-type:focus {
-  color: #337ab7;
-  cursor: pointer;
-
-  &:hover {
-    color: rgb(32, 160, 255);
-  }
-}
-
-.filter-container {
-  padding-bottom: 10px;
-
-  .filter-item {
-    display: inline-block;
-    vertical-align: middle;
-    margin-bottom: 10px;
-  }
-}
-
-//refine vue-multiselect plugin
-.multiselect {
-  line-height: 16px;
-}
-
-.multiselect--active {
-  z-index: 1000 !important;
-}
-.el-date-transparent {
-  margin-left: -15px;
-  input {
-    border: none !important;
-    background: transparent !important;
-  }
-}
-
-#app .hideSidebar .nav-icon {
-  margin-left: 20px;
-}
-
-.form-item-min-margin {
-  /*.el-form-item {
-    margin-bottom: 0px;
-  }*/
-   .el-textarea__inner {
-     line-height: 36px;
-     margin-bottom: 10px;
-   }
-}