renusify 2.4.3 → 2.4.4

package/components/bar/scss/toolbar.scss

@@ -26,6 +26,8 @@
       overflow: auto;
       position: absolute;
       transition: .5s all map.get(base.$transition, 'swing');
+      background-color: var(--color-sheet);
+      color: var(--color-on-sheet);
       @include mixins.rtl() {
         right: -300px;
       }
@@ -94,7 +96,6 @@
     &:before {
       content: '-';
       position: absolute;
-      color: #9e9e9e;
       @include mixins.rtl() {
         right: -8px;
       }
@@ -110,10 +111,10 @@
     max-height: 500px;
     overflow-y: auto;
     @include mixins.rtl() {
-      border-right: 1px solid #9e9e9e;
+      border-right: 1px solid;
     }
     @include mixins.ltr() {
-      border-left: 1px solid #9e9e9e;
+      border-left: 1px solid;
     }
   }
 

package/components/chart/chart.vue

@@ -3,34 +3,59 @@
 </template>
 
 <script>
-
 export default {
-  name: "r-chart",
+  name: 'r-chart',
   props: {
+    url: {type: String, default: 'https://codenus.com/storage/chart/apexcharts.js'},
+    dark: Boolean,
     options: Object
   },
   data() {
     return {
       chartShape: null,
-      Chart: null
-    };
+      timeout_id: null
+    }
   },
-  mounted(){
-    import('./apexcharts.js').then((d) => {
-      this.Chart=d.default;
+  mounted() {
+    let children = document.querySelectorAll('[name=\'apexcharts\']')
+    if (children.length === 0) {
+      let el = document.createElement('script')
+      el.setAttribute('src', this.url)
+      el.setAttribute('name', 'apexcharts')
+      document.head.append(el)
+    }
+    if (this.dark) {
+      if (!this.options['theme']) {
+        this.options['theme'] = {}
+      }
+      this.options['theme']['mode'] = 'dark'
+    }
+
+    this.timeout_id = setTimeout(() => {
       this.build()
-    })
+    }, 10)
+
   },
   methods: {
-    build() {
-      this.chartShape = new this.Chart(this.$refs.chart, this.options);
-      this.chartShape.render()
+    build(n = 0) {
+      try {
+        this.chartShape = new ApexCharts(this.$refs.chart, this.options)
+        this.chartShape.render()
+      } catch (e) {
+        this.timeout_id = setTimeout(() => {
+          this.build(n + 1)
+        }, 100)
+        if (n > 30) {
+          console.error(e)
+        }
+      }
     }
   },
   beforeUnmount() {
-    this.chartShape.destroy();
+    clearTimeout(this.timeout_id)
+    this.chartShape.destroy()
   }
-};
+}
 </script>
 <style lang="scss">
 @use "../../style/variables/base";

package/components/form/dateInput/index.vue

@@ -1,8 +1,8 @@
 <template>
   <r-input v-bind="$attrs" :readonly="readonly" :model-value="modelValue" @click.prevent="show=true">
-    <input
-        :value="modelValue?$d(modelValueDate,withTime?'long':'medium',locale):null"
-    />
+    <div :class="`${$r.prefix}date-color-input`">
+      {{ modelValue ? $d(modelValueDate, withTime ? 'long' : 'medium', locale) : null }}
+    </div>
   </r-input>
   <r-modal :model-value="show" @update:model-value="close()" :closebtn="false" closable class="text-center">
     <div v-if="!showTime" :class="`${$r.prefix}date-input`">
@@ -364,6 +364,9 @@ export default {
 <style lang="scss">
 @use "../../../style/variables/base";
 
+.#{base.$prefix}date-color-input {
+  color: var(--color-on-sheet);
+}
 .#{base.$prefix}date-input {
   position: relative;
   display: inline-block;

package/components/form/numberInput/index.vue

@@ -51,23 +51,12 @@ export default {
   },
   watch: {
     'modelValue': function (newVal) {
-      this.number = newVal
+      if (newVal !== undefined) {
+        this.number = newVal
+      }
     }
   },
   methods: {
-    setSplit(n) {
-      if (n && this.split > 0) {
-        const x = this.split
-        n = n.toString()
-        const step = n.indexOf('.')
-        const re = '\\d(?=(\\d{' + (x) + '})+' + (step > -1 ? '\\.' : '$') + ')';
-        return n.replace(new RegExp(re, 'g'), '$&,');
-      }
-      return n
-    },
-    set_step(number) {
-
-    },
     emit() {
       if (this.number === '' || this.number === null) {
         this.number = undefined
@@ -79,7 +68,8 @@ export default {
         d = this.max
       }
       if (this.min !== undefined && d < this.min) {
-        d = this.min
+        this.$emit('update:modelValue', undefined)
+        return
       }
 
       this.number = d
@@ -95,7 +85,7 @@ export default {
       this.number = n - this.step
       this.emit()
     }
-  },
+  }
 }
 </script>
 

package/components/form/passwordInput/index.vue

@@ -15,7 +15,7 @@
              @focusin="active=true"
              @focusout="active=false"
              @input="emit"
-             autocomplete="no"
+             :autocomplete="autocomplete"
              ref="input"
              v-model="lazyValue"
       />
@@ -61,6 +61,7 @@ export default {
     specialChar: Boolean,
     number: Boolean,
     minLength: {type: Number, default: 8},
+    autocomplete: {type: String, default: "no"},
   },
   emits: ['update:modelValue'],
   data() {

package/components/table/crud/index.vue

@@ -1,7 +1,8 @@
 <template>
   <div :class="`${$r.prefix}table-manage`">
     <r-modal v-model="showForm" bottom full-width>
-      <slot :autoSend="autoSend" :method="method"
+      <slot :autoSend="autoSend"
+            :method="method"
             :modelValue="editedItem"
             :ok="ok"
             :options="table.option"
@@ -444,9 +445,13 @@ export default {
       this.refresh()
     },
     ok() {
-      this.refresh()
+      this.table.startTime = false
+      this.page = 1;
+      this.sortBy = null;
+      this.sortType = 0;
       this.autoSend = false
       this.showForm = false
+      this.refresh()
     },
     refresh(e) {
       this.loading = true

package/components/tabs/index.vue

@@ -98,8 +98,6 @@ export default {
 <style lang="scss">
 @use "../../style/variables/base";
 
-$btnTabsWidth: 50px;
-
 .#{base.$prefix}tabs {
   max-width: 100%;
   display: flex;
@@ -109,7 +107,7 @@ $btnTabsWidth: 50px;
     position: relative;
     margin: 0 auto;
     white-space: nowrap;
-    width: calc(100% - #{$btnTabsWidth*2});
+    width: 100%;
     overflow: auto;
 
     scroll-behavior: smooth;
@@ -149,9 +147,5 @@ $btnTabsWidth: 50px;
       margin-right: 0;
     }
   }
-
-  .btn-tabs {
-    width: $btnTabsWidth;
-  }
 }
 </style>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "renusify",
-  "version": "2.4.3",
+  "version": "2.4.4",
   "description": "Vue3 Framework",
   "keywords": [
     "vuejs",