renusify 1.4.3 → 1.4.7

package/components/app/index.vue

@@ -8,30 +8,21 @@
       <slot></slot>
     </div>
     <r-toast></r-toast>
-    <r-notify v-if="notify" :left="notifyLeft" :top="notifyTop">
-      <template #content="props">
-        <slot name="notify" :item="props"></slot>
-      </template>
-    </r-notify>
   </div>
 </template>
 
 <script>
 import './style.scss'
 import RToast from './toast/index.vue'
-import RNotify from './notify/index.vue'
 
 export default {
   name: 'r-app',
-  components: {RToast, RNotify},
+  components: {RToast},
   props: {
     id: {
       type: [String, Number],
       default: 'renusify'
     },
-    notify: Boolean,
-    notifyLeft: Boolean,
-    notifyTop: Boolean,
     rtl: {type: Boolean, default: undefined}
   },
   computed: {

package/components/chip/style.scss

@@ -56,7 +56,6 @@ $icon-sizes: (
 
 
   border-color: var(--color-divider);
-  color: var(--color-text-primary);
 
   &:not(.chip-active) {
     background: #e0e0e0;

package/components/codeEditor/highlightHtml.vue

@@ -52,7 +52,7 @@ export default {
       res = this.re_func(res);
 
       res = res.replace(/(&lt;+[\s\S]+&gt;)/g, '<span class="color-orange code-editor-span">$1</span>')
-      res = res.replace(/(\{\{+[\s\S]+}})/g, '<span class="color-blue code-editor-span">$1</span>')
+      res = res.replace(/\{\{([^}]+)}}/g, '<span class="color-blue code-editor-span">{{$1}}</span>')
       return res;
     },
   },
@@ -74,7 +74,13 @@ export default {
         this.openTag = null
         return false
       }
-
+      if (event.key === "=") {
+        const end = event.target.selectionEnd;
+        event.preventDefault()
+        document.execCommand('insertText', false, '=""');
+        event.target.selectionEnd = end + 2;
+        return false;
+      }
       return this.setTab(event)
     },
     re_comment(res) {

package/components/codeEditor/index.vue

@@ -25,37 +25,33 @@
         <r-icon v-html="$r.icons.code_tags" exact></r-icon>
       </r-btn>
     </div>
-    <div v-show="false" ref="codeSlot">
-      <slot></slot>
-    </div>
     <div v-if="show === 'run' && runnable" class="code-compile">
       <r-code-editor-run
           :id="id"
-          :script="script"
-          :style="style"
-          :template="template"
+          :script="scr"
+          :style="sty"
+          :template="temp"
       ></r-code-editor-run>
     </div>
     <div v-show="show !== 'run'" ref="codeView" class="code-wrapper">
-      <div v-show="templateShow">
-        <span class="color-green">&lt;template&gt;</span>
+      <div>
+        <span v-show="templateShow" class="color-green">&lt;template&gt;</span>
         <highlight-html ref="h-html" v-model="temp"></highlight-html>
-        <span class="color-green">&lt;/template&gt;</span>
-        <br/>
+        <span v-show="templateShow" class="color-green">&lt;/template&gt;</span>
       </div>
-      <div v-show="scriptShow">
-        <span class="color-orange"
+      <div>
+        <span v-show="scriptShow" class="color-orange"
         >&lt;script&gt;<br/>export default {</span
         >
         <highlight-script ref="h-js" v-model="scr"></highlight-script>
-        <span class="color-orange">}<br/>&lt;script&gt;</span>
+        <span v-show="scriptShow" class="color-orange">}<br/>&lt;script&gt;</span>
       </div>
-      <div v-show="styleShow">
-        <span class="color-orange"
+      <div>
+        <span v-show="styleShow" class="color-orange"
         >&lt;style lang<span class="color-green">="css"</span>&gt;</span
         >
         <highlight-css ref="h-css" v-model="sty"></highlight-css>
-        <span class="color-orange">&lt;style&gt;</span>
+        <span v-show="styleShow" class="color-orange">&lt;style&gt;</span>
       </div>
     </div>
   </div>
@@ -101,9 +97,6 @@ export default {
           '<svg xmlns="http://www.w3.org/2000/svg"  width="24" height="24" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="m14.6 16.6l4.6-4.6l-4.6-4.6L16 6l6 6l-6 6l-1.4-1.4m-5.2 0L4.8 12l4.6-4.6L8 6l-6 6l6 6l1.4-1.4Z"/></svg>';
     }
   },
-  mounted() {
-    this.get_code("codeSlot");
-  },
   watch: {
     template: function (n) {
       this.temp = n
@@ -129,42 +122,7 @@ export default {
       this.temp = this.$refs["h-html"].pretty_html(this.temp)
       this.scr = this.$refs["h-js"].pretty_js(this.scr)
       this.sty = this.$refs["h-css"].pretty_js(this.sty)
-    },
-    toHTML(htmlString) {
-      let div = document.createElement("div");
-      div.innerHTML = htmlString;
-      return div;
-    },
-    get_code(slot = "codeSlot") {
-      if (!this.$refs[slot]) {
-        setTimeout(() => {
-          this.get_code(slot);
-        }, 100);
-        return;
-      }
-
-      this.code = this.toHTML(this.$refs[slot].innerHTML);
-      let temp = this.code.querySelector(".code-template");
-
-      if (temp && temp.childNodes.length > 0) {
-        for (let i = 0; i < temp.childNodes.length; i++) {
-          if (temp.childNodes[i].nodeName === "#comment") {
-            this.template = this.toHTML(temp.childNodes[i].nodeValue).innerHTML;
-            break;
-          }
-        }
-      }
-
-      let script = this.code.querySelector(".code-script");
-      if (script && script.childNodes.length > 0) {
-        for (let i = 0; i < script.childNodes.length; i++) {
-          if (script.childNodes[i].nodeName === "#comment") {
-            this.script = script.childNodes[i].nodeValue;
-            break;
-          }
-        }
-      }
-    },
+    }
   },
 };
 </script>

package/components/codeEditor/mixin.js

@@ -1,6 +1,10 @@
 export default {
     methods: {
         pretty_html(text) {
+            if (!text) {
+                return ''
+            }
+            text = text.trim()
             text = text.replace(/ +(?= )/g, '');
             text = text.replace(/[\r|\n|\t]/g, '');
             let r = ''
@@ -18,9 +22,14 @@ export default {
                     }
                 }
             })
+            r = r.replace(/<([^/].*)>+[\r|\n|\t]+<\//g, '<$1></');
             return r
         },
         pretty_js(text) {
+            if (!text) {
+                return ''
+            }
+            text = text.trim()
             text = text.replace(/ +(?= )/g, '');
             text = text.replace(/[\r|\n|\t]/g, '');
             text = text.replace(/([,|;|{|(|\[])+[\s]/g, '$1');
@@ -50,6 +59,9 @@ export default {
                 if (c === '}') {
                     numopen -= 1
                 }
+                if (numopen < 0) {
+                    numopen = 0
+                }
                 r += c
                 if (c === '}' && next !== ',' && next !== ';' && next !== '}' && next !== ')') {
                     r += '\n' + '\t'.repeat(numopen)
@@ -60,7 +72,8 @@ export default {
                 if (c === ';' && next !== '}') {
                     r += '\n' + '\t'.repeat(numopen)
                 }
-                if (next === '}' && c !== '{') {
+                if (next === '}' && c !== '{' && numopen > 0) {
+
                     r += '\n' + '\t'.repeat(numopen - 1)
                 }
 
@@ -112,11 +125,12 @@ export default {
             if (event.keyCode === 13) {
                 event.preventDefault()
                 let n = event.target.value.substr(0, event.target.selectionStart).split('\n')
-                n = n[n.length - 1].split('')
+                n = n[n.length - 1].split('\t')
+
                 let w = ''
                 for (let i = 0; i < n.length; i++) {
-                    if (n[i] === ' ') {
-                        w += ' '
+                    if (n[i] === '') {
+                        w += '\t'
                     } else {
                         break
                     }

package/components/form/camInput.vue

@@ -133,7 +133,7 @@ export default {
     },
     headers: Object
   },
-  emits:['update:modelValue','error'],
+  emits: ['update:modelValue', 'error'],
   data() {
     return {
       started: false,
@@ -268,7 +268,11 @@ export default {
               },
               (err) => {
                 this.uploadPercentage = 0;
-                this.$emit('error', err.response.data)
+                if (err.response) {
+                  this.$emit('error', err.response.data)
+                } else {
+                  this.$emit('error', err)
+                }
               }
           );
     },

package/components/form/input.vue

@@ -2,7 +2,7 @@
   <div
       :class="{
         [`${$r.prefix}input-container`]:true,
-        [c_color]:c_color&&!isDisabled,
+        [c_color]:c_color&&!isDisabled&&!hasError,
         'color-error-text':hasError&&genMessages.length>0,
         'hide-detail':c_hide,
         'input-focused':active,
@@ -521,7 +521,7 @@ export default {
     }
   }
 
-  &.text-area {
+  &.#{$prefix}text-area {
     .input-control {
       height: auto;
 

package/components/form/mask-input.vue

@@ -74,11 +74,11 @@
                 for (let i = 0; i <lng; i++) {
                     const dataChar = data.charAt(n);
                     const maskChar = mask.charAt(i);
-                    switch (maskChar) {
+
+                  switch (maskChar) {
                         case 'N':
                             if (/[0-9]/.test(dataChar)) {
                                 dataOutput += dataChar;
-
                             }
                             n++
                             break;

package/components/form/select.vue

@@ -11,7 +11,7 @@
         'flex-nowrap':!multiple
       }">
         <r-chip
-            class="my-0 ms-0"
+            class="my-0 ms-0 color-primary-text"
             :close="multiple&&!textChip"
             :key="key"
             :text="textChip || !multiple"

package/components/form/text-area.vue

@@ -3,8 +3,7 @@
            v-model="lazyValue"
            @click.stop="handleClick()"
            @update:model-value="emit"
-           class="text-area"
-           :class="{'no-resize':noResize}"
+           :class="[`${$r.prefix}text-area`,{'no-resize':noResize}]"
   >
     <template v-slot="{uid}">
       <textarea @focusin="active=true"

package/components/form/text-editor/index.vue

@@ -37,7 +37,6 @@
                 <r-select-input :label="$t('class','renusify')" :model-value="[...selectElm.classList]"
                                 multiple
                                 tags
-                                disableSearch
                                 justValue
                                 @update:model-value="addClass"></r-select-input>
             </r-col>

package/components/form/timepicker/index.vue

@@ -30,22 +30,24 @@
             :withSec="withSec"
             v-model="lazyValue"
         ></timepicker>
-        <r-btn
-            class="color-success-text ml-7 mr-9 mb-3 mt-3"
-            outlined
-            @click="show_modal = false,emit()"
-        >
-          {{ $t('accept', 'renusify') }}
-        </r-btn
-        >
-        <r-btn
-            class="color-warning-text mr-7 ml-4 mb-3 mt-3"
-            outlined
-            @click="(show_modal = false), (lazyValue = null),emit()"
-        >
-          {{ $t('cancel', 'renusify') }}
-        </r-btn
-        >
+        <div class="my-3 d-flex h-space-between">
+          <r-btn
+              class="color-success-text"
+              outlined
+              @click="show_modal = false,emit()"
+          >
+            {{ $t('accept', 'renusify') }}
+          </r-btn
+          >
+          <r-btn
+              class="color-warning-text"
+              outlined
+              @click="(show_modal = false), (lazyValue = null),emit()"
+          >
+            {{ $t('cancel', 'renusify') }}
+          </r-btn
+          >
+        </div>
       </r-card>
     </r-modal>
   </div>

package/components/form/unit-input.vue

@@ -99,6 +99,7 @@ emits:['update:modelValue'],
 
     .input-control {
       border-radius: 0;
+      padding: 4px;
       @include rtl() {
         border-right: 1px solid var(--c-unit) !important;
       }

package/components/formCreator/index.vue

@@ -6,9 +6,9 @@
         <r-row>
           <template :key="key" v-for="(item,key) in options">
             <r-col v-if="item['formInput']!==false&&iff(options[key])"
-                   :class="options[key]['r-col']?options[key]['r-col']:'col-12'">
+                   :class="options[key]['class']?options[key]['class']:'col-12'">
               <component
-                  :is="buildName(item['type'])"
+                  :is="item['type']"
                   :label="$t(key)"
                   v-model="editedItem[key]"
                   v-bind="getAttr(options[key])"
@@ -99,12 +99,6 @@ export default {
     }
   },
   methods: {
-    buildName(name) {
-      if (name.startsWith('r-')) {
-        return name
-      }
-      return 'r-' + name
-    },
     iff(data) {
       const that = this
 
@@ -152,18 +146,11 @@ export default {
       return true
     },
     getAttr(data) {
-      let res = {}
-      for (let i in data) {
-        if (this.$helper.hasKey(data, i) && !['formInput', 'sortable', 'type', 'tableShow', 'priority', '$if', 'r-col'].includes(i)) {
-          if (i === '$bind') {
-            data[i].forEach((item) => {
-              res[item[0]] = this.editedItem[item[1]]
-            })
-
-          } else {
-            res[i] = data[i]
-          }
-        }
+      let res = data['props'] ? data['props'] : {}
+      if (data['$bind']) {
+        data['$bind'].forEach((item) => {
+          res[item[0]] = this.editedItem[item[1]]
+        })
       }
       return res
     },

package/components/index.js

@@ -1,5 +1,6 @@
 const list = {
     'r-app': {'p': 'app/index.vue', 'c': ['r-btn', 'r-icon', 'r-spacer'], 'd': []},
+    'r-notify': {'p': 'notify/index.vue', 'c': ['r-btn', 'r-icon'], 'd': []},
     'r-avatar': {'p': 'avatar/index.vue', 'c': ['r-btn', 'r-icon'], 'd': []},
     'r-toolbar': {
         'p': 'bar/toolbar/index.vue',
@@ -146,7 +147,6 @@ const list = {
         'c': ['r-progress-line', 'r-card', 'r-list', 'r-btn', 'r-icon', 'r-select-input'],
         'd': ['click-outside']
     },
-    'r-skeleton': {'p': 'skeleton/index.vue', 'c': [], 'd': []},
     'r-slider': {'p': 'slider/index.vue', 'c': ['r-progress-line', 'r-btn', 'r-icon'], 'd': ['touch']},
     'r-swiper': {'p': 'swiper/index.vue', 'c': [], 'd': ['touch']},
     'r-table': {

package/components/infinite/index.vue

@@ -13,17 +13,19 @@
                 </r-col>
             </r-row>
         </r-container>
-        <r-infinite-div  class="pt-0"
+        <r-infinite-div class="pt-0"
                         :url="url"
                         :height="height"
                         :query="query"
                         :live-timer="liveTimer"
-                         :is-chat="isChat"
-                        :live="live">
+                        :is-chat="isChat"
+                        :headers="headers"
+                        :live="live"
+        >
 
-            <template v-slot="{item}">
-                <slot v-bind:item="item"></slot>
-            </template>
+          <template v-slot="{item}">
+            <slot v-bind:item="item"></slot>
+          </template>
 
         </r-infinite-div>
     </r-card>
@@ -59,6 +61,7 @@
                 default: 10000,
                 type: Number
             },
+          headers: Object
         },
         data() {
             return {

package/components/map/index.vue

@@ -1,16 +1,19 @@
 <template>
   <div ref="map"
+       :style="{
+          '--map-image-layers':`url(${iconLayers})`
+  }"
        :class="{[`${$r.prefix}map`]:true,'map-dark': dark, 'attribution-show': attribution }"
   >
     <div class="map-search" v-if="searchBox">
       <r-search-box
           :label="$t('search','renusify')"
-          @select="go"
-          url="https://nominatim.openstreetmap.org/search.php?polygon_geojson=0&accept-language=fa&countrycodes=IR&format=jsonv2"
-          query="q"
-          no-overlay
-          inputControlClass="sheet"
           :notFoundMsg="$t('map_not_found','renusify')"
+          inputClass="sheet"
+          no-overlay
+          query="q"
+          url="https://nominatim.openstreetmap.org/search.php?polygon_geojson=0&accept-language=fa&countrycodes=IR&format=jsonv2"
+          @select="go"
       >
         <template v-slot="{ item }">
           {{ item["display_name"] }}
@@ -21,20 +24,20 @@
 
     <r-btn
         v-if="meLocation"
+        :loading="loading"
         class="map-location color-white color-primary-text"
         icon
         @click.prevent="showConfirm"
-        :loading="loading"
     >
       <r-icon v-html="$r.icons.crosshairs_gps"></r-icon>
     </r-btn>
     <r-btn
-        class="map-attribution color-white color-primary-text"
-        @click.prevent="attribution = !attribution"
-        size="x-small"
+        class="map-attribution color-white color-black-text"
         icon
+        size="x-small"
+        @click.prevent="attribution = !attribution"
     >
-      <r-icon v-html="$r.icons.copyright" exact></r-icon>
+      C
     </r-btn>
 
     <r-confirm v-model="confirm"
@@ -54,7 +57,10 @@ export default {
     center: {
       type: Array,
       default: () => {
-        return [35.69940749291485, 51.33705139160157];
+        return [
+          35.69973857757377,
+          51.33806092139637
+        ];
       }
     },
     markers: {
@@ -68,10 +74,13 @@ export default {
     layerControl: {type: Boolean, default: true},
     meLocation: {type: Boolean, default: true},
     disableMove: {type: Boolean, default: false},
-    darkMode: Boolean
+    darkMode: Boolean,
+    mapImageMarker: String,
+    mapImageLayers: String
   },
   data() {
     return {
+      timeout_id: null,
       dark: this.darkMode,
       attribution: false,
       confirm: false,
@@ -84,26 +93,37 @@ export default {
       license: '&copy; | <a href="https://leafletjs.com" target="_blank">Leaflet</a> | <a href="https://www.openstreetmap.org/copyright" target="_blank">OpenStreetMap</a> contributors | Renusify'
     };
   },
-  emits:['update:modelValue','leaflet','map'],
+  emits: ['update:modelValue', 'leaflet', 'map'],
   created() {
     if (!this.$r.icons.crosshairs_gps) {
       this.$r.icons.crosshairs_gps = '<svg xmlns="http://www.w3.org/2000/svg"  width="24" height="24" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="M12 8a4 4 0 0 1 4 4a4 4 0 0 1-4 4a4 4 0 0 1-4-4a4 4 0 0 1 4-4m-8.95 5H1v-2h2.05C3.5 6.83 6.83 3.5 11 3.05V1h2v2.05c4.17.45 7.5 3.78 7.95 7.95H23v2h-2.05c-.45 4.17-3.78 7.5-7.95 7.95V23h-2v-2.05C6.83 20.5 3.5 17.17 3.05 13M12 5a7 7 0 0 0-7 7a7 7 0 0 0 7 7a7 7 0 0 0 7-7a7 7 0 0 0-7-7Z"/></svg>'
     }
-    if (!this.$r.icons.copyright) {
-      this.$r.icons.copyright = '<svg xmlns="http://www.w3.org/2000/svg"  width="24" height="24" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="M10.08 10.86c.05-.33.16-.62.3-.86c.3-.56.81-.85 1.5-.86c.45 0 .86.2 1.15.49c.28.31.47.74.47 1.17h1.8c-.02-.47-.11-.9-.3-1.3c-.15-.38-.38-.72-.68-1c-1.45-1.34-4.14-1.15-5.37.37c-1.29 1.67-1.32 4.59-.01 6.26c1.21 1.49 3.86 1.7 5.3.37c.31-.25.56-.56.76-.92c.16-.36.27-.74.28-1.15H13.5c0 .21-.07.4-.16.57c-.09.19-.21.34-.34.47c-.33.26-.72.4-1.14.4c-.36-.01-.66-.08-.89-.23a1.41 1.41 0 0 1-.59-.64c-.5-.9-.42-2.15-.3-3.14M12 2C6.5 2 2 6.5 2 12c.53 13.27 19.5 13.26 20 0c0-5.5-4.5-10-10-10m0 18c-4.41 0-8-3.59-8-8c.44-10.61 15.56-10.61 16 0c0 4.41-3.59 8-8 8Z"/></svg>'
-    }
   },
   async beforeMount() {
     await this.add();
   },
   watch: {
-    modelValue: function () {
+    modelValue: function (n, o) {
       this.map.flyTo(this.modelValue);
     },
     markers: function () {
       this.printMarkers()
     }
   },
+  computed: {
+    iconLayers() {
+      if (this.mapImageLayers) {
+        return this.mapImageLayers
+      }
+      return require('./images/layers.png')
+    },
+    iconMarker() {
+      if (this.mapImageMarker) {
+        return this.mapImageMarker
+      }
+      return require('./images/marker-icon.png')
+    }
+  },
   methods: {
     showConfirm() {
       if (this.$storage.has('map_location_access')) {
@@ -114,7 +134,7 @@ export default {
     },
     go(e) {
       if (e.lat) {
-        this.map.flyTo([e.lat, e.lon]);
+        this.$emit("update:modelValue", [parseFloat(e.lat), parseFloat(e.lon)]);
       }
     },
     initMap() {
@@ -186,8 +206,13 @@ export default {
           that.dark = that.darkMode;
         }
       });
-      this.map.on("move", function () {
-        that.$emit("update:modelValue", Object.values(that.map.getCenter()));
+      this.map.on("move", function (e) {
+        if (e.originalEvent) {
+          clearTimeout(that.timeout_id)
+          that.timeout_id = setTimeout(() => {
+            that.$emit("update:modelValue", Object.values(that.map.getCenter()));
+          }, 100)
+        }
       });
     },
     run() {
@@ -219,6 +244,13 @@ export default {
         let options = {riseOnHover: true, item: item}
         if (item.icon) {
           options.icon = new this.L.icon(item.icon);
+        } else {
+          options.icon = new this.L.icon({
+            iconUrl: this.iconMarker,
+            iconSize: [30, 30],
+            iconAnchor: [15, 30],
+            popupAnchor: [0, -30]
+          });
         }
         let marker = new this.L.Marker(item.loc, options);
         marker.addTo(this.layerGroup)