renusify 2.1.5 → 2.1.8

package/docs/src/views/index/v1/component/chart/fa.vue

@@ -0,0 +1,113 @@
+<template>
+  <section>
+    <div class="color-white mb-2">
+      <h1 class="display-3 font-weight-light color-white ps-4 pb-1 pt-1 br-lg">
+        r-chart
+      </h1>
+      <div>
+        r-chart از کتابخانه
+        <a href="https://github.com/apexcharts/apexcharts.js" target="_blank"
+        >apexcharts.js</a
+        >
+        برای نمایش استفاده می کند. لطفا برای اطلاع از تمامی چارت ها و نحوه
+        استفاده به سایت
+        <a href="https://apexcharts.com" target="_blank">apexcharts</a> مراجعه
+        کنید
+      </div>
+      <p class="font-weight-light ps-4 pb-1 py-4 br-lg">
+        نمودارهای آسان و زیبا با
+        <r-btn readonly size="small"> r-chart</r-btn>
+      </p>
+    </div>
+    <table-props :items="items"></table-props>
+  </section>
+  <section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script='data(){
+ return {
+    "options": {
+                "chart": {"type": "area"},
+                "fill": {
+                    "type": "gradient",
+                    "gradient": {
+                        "enabled": true,
+                        "opacityFrom": 0.7,
+                        "opacityTo": .1
+                    }
+                },
+                "markers": {
+                    "size": 5,
+                    "strokeWidth": 3
+                },
+                "dataLabels": {
+                    "enabled": false
+                },
+                "series": [
+                    {
+                        "name": "تعداد",
+                        "data": [23,45,63,32,57]
+                    },
+                    {
+                        "name": "قیمت",
+                        "data": [1200,2300,400,900,200]
+                    }
+                ],
+
+                "xaxis": {
+                    "categories": [1,2,3,4,5],
+                }
+            }
+}
+}'
+        template='<r-chart :options="options" ></r-chart>'
+    ></r-code-editor>
+  </section>
+  <section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script='data(){
+ return {
+    "options": {
+            "chart": {"type": "bar"},
+            "series": [
+                {
+                    "name": "count",
+                    "data": [34,56,22,11,67]
+                }
+            ],
+            "plotOptions": {
+                "bar": {
+                    "distributed": true
+                }
+            },
+            "legend": {"show": false},
+            "xaxis": {
+                "categories": [1,2,3,4,5]
+            }
+        }
+}
+}'
+        template='<r-chart :options="options" ></r-chart>'
+    ></r-code-editor>
+  </section>
+</template>
+<script>
+export default {
+  name: "chart",
+  data() {
+    return {
+      items: [
+        {
+          prop: "options",
+          type: "Object",
+          default: "null",
+          description: "Option می گیرد",
+        },
+      ],
+    };
+  },
+};
+</script>

package/docs/src/views/index/v1/component/chart/worldMap/en.vue

@@ -0,0 +1,112 @@
+<template>
+  <section>
+    <div class="color-white mb-2">
+      <h1 class="display-3 font-weight-light color-white ps-4 pb-1 pt-1 br-lg">
+        r-chart-map
+      </h1>
+      <p class="font-weight-light ps-4 pb-1 py-4 br-lg">
+        The svg map with
+        <r-btn readonly size="small">r-chart-map</r-btn>
+      </p>
+    </div>
+
+    <table-props :items="items"></table-props>
+  </section>
+  <section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+  return {
+    colors:{
+      'US':'#43ab5f',
+      'IR':'#83ac5f',
+    }
+  }
+}"
+        template="<r-chart-map :colors='colors'></r-chart-map>"
+    ></r-code-editor>
+  </section>
+  <section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+  return {
+    maxColor:'#760101',
+    minColor:'#f8c6c6',
+    defaultColor:'#aaaaaa',
+    disableTooltip:false,
+    Western_Sahara_is_country:false,
+    Crimea:'UA',
+    heatValues:{
+      'US':60,
+      'IR':80,
+    }
+  }
+}"
+        template="<r-chart-map :heatValues='heatValues' :maxColor='maxColor' :minColor='minColor'
+  :defaultColor='defaultColor' :disableTooltip='disableTooltip' :Western_Sahara_is_country='Western_Sahara_is_country'
+  :Crimea='Crimea'></r-chart-map>"
+    ></r-code-editor>
+  </section>
+</template>
+<script>
+export default {
+  name: "chart",
+  data() {
+    return {
+      items: [
+        {
+          prop: "colors",
+          type: "Object",
+          default: "{}",
+          description: "color list for each country",
+        },
+        {
+          prop: "heatValues",
+          type: "Object",
+          default: "{}",
+          description: "heat value list for each country",
+        },
+        {
+          prop: "maxColor",
+          type: "String",
+          default: "#760101",
+          description: "max color for heatValues",
+        },
+        {
+          prop: "minColor",
+          type: "String",
+          default: "#f8c6c6",
+          description: "min color for heatValues",
+        },
+        {
+          prop: "defaultColor",
+          type: "String",
+          default: "#aaaaaa",
+          description: "default color for all country",
+        },
+        {
+          prop: "Crimea",
+          type: "String",
+          default: "null",
+          description: "Crimea is for Russia or Ukraine",
+        },
+        {
+          prop: "Western_Sahara_is_country",
+          type: "Boolean",
+          default: "false",
+          description: "Western Sahara is country or not",
+        },
+        {
+          prop: "disableTooltip",
+          type: "Boolean",
+          default: "false",
+          description: "disable tooltip on hover",
+        },
+      ],
+    };
+  },
+};
+</script>

package/docs/src/views/index/v1/component/chart/worldMap/fa.vue

@@ -0,0 +1,114 @@
+<template>
+  <section>
+    <div class="color-white mb-2">
+      <h1 class="display-3 font-weight-light color-white ps-4 pb-1 pt-1 br-lg">
+        r-chart-map
+      </h1>
+      <p class="font-weight-light ps-4 pb-1 py-4 br-lg">
+        نقشه جهان با
+        <r-btn readonly size="small">r-chart-map</r-btn>
+      </p>
+    </div>
+
+    <table-props :items="items"></table-props>
+  </section>
+  <section>
+    می توانید برای هر کشور رنگ دلخواهی انتخاب کنید.
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+  return {
+    colors:{
+      'US':'#43ab5f',
+      'IR':'#83ac5f',
+    }
+  }
+}"
+        template="<r-chart-map :colors='colors'></r-chart-map>"
+    ></r-code-editor>
+  </section>
+  <section>
+    با heatValues می توانید یک نقشه گرمایی ایجاد کنید.
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+  return {
+    maxColor:'#760101',
+    minColor:'#f8c6c6',
+    defaultColor:'#aaaaaa',
+    disableTooltip:false,
+    Western_Sahara_is_country:false,
+    Crimea:'UA',
+    heatValues:{
+      'US':20,
+      'IR':80,
+    }
+  }
+}"
+        template="<r-chart-map :heatValues='heatValues' :maxColor='maxColor' :minColor='minColor'
+  :defaultColor='defaultColor' :disableTooltip='disableTooltip' :Western_Sahara_is_country='Western_Sahara_is_country'
+  :Crimea='Crimea'></r-chart-map>"
+    ></r-code-editor>
+  </section>
+</template>
+<script>
+export default {
+  name: "chart",
+  data() {
+    return {
+      items: [
+        {
+          prop: "colors",
+          type: "Object",
+          default: "{}",
+          description: "color list for each country",
+        },
+        {
+          prop: "heatValues",
+          type: "Object",
+          default: "{}",
+          description: "heat value list for each country",
+        },
+        {
+          prop: "maxColor",
+          type: "String",
+          default: "#760101",
+          description: "max color for heatValues",
+        },
+        {
+          prop: "minColor",
+          type: "String",
+          default: "#f8c6c6",
+          description: "min color for heatValues",
+        },
+        {
+          prop: "defaultColor",
+          type: "String",
+          default: "#aaaaaa",
+          description: "default color for all country",
+        },
+        {
+          prop: "Crimea",
+          type: "String",
+          default: "null",
+          description: "Crimea is for Russia or Ukraine",
+        },
+        {
+          prop: "Western_Sahara_is_country",
+          type: "Boolean",
+          default: "false",
+          description: "Western Sahara is country or not",
+        },
+        {
+          prop: "disableTooltip",
+          type: "Boolean",
+          default: "false",
+          description: "disable tooltip on hover",
+        },
+      ],
+    };
+  },
+};
+</script>

package/docs/src/views/index/v1/component/chat/en.vue

@@ -0,0 +1,153 @@
+<template>
+  <section>
+    <div class="color-white mb-2">
+      <h1 class="display-3 font-weight-light color-white ps-4 pb-1 pt-1 br-lg">
+        r-chat
+      </h1>
+      <p class="font-weight-light ps-4 pb-1 py-4 br-lg">
+        This
+        <r-btn readonly size="small"> r-chat</r-btn>
+        component allows you to create chat rooms, join them, express your
+        emotions using an emoji picker, and scroll up to load previous messages.
+      </p>
+    </div>
+
+    <table-props :items="props"></table-props>
+    <table-events :items="events" class="mt-5"></table-events>
+  </section>
+  <section class="mt-10">
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script='data(){
+ return {
+    "sendByEnter": false,
+    "placeholder": "type here",
+    "hideBottomBtn": false,
+    "hideSend": false,
+    "maxLenMsg": 200,
+    "participants": {"1":{"name":"smko","img":"/"},"2":{"name":"pegi","img":"/"},},
+    "messages": [{
+      "type": "text",
+      "content": "hi, Pegi",
+      "_id": "bllfcfdedfa7egkf",
+      "created_at": "2023-08-17T15:55:40.309Z",
+      "user_id":"1"
+    },{
+      "type": "text",
+      "content": "hi, smko",
+      "_id": "bllfcfdedfa7egkm",
+      "created_at": "2023-08-17T15:57:40.309Z",
+      "user_id":"2"
+    }],
+    "myself": {"id":"1","name":"smko","img":"/"},
+    "title": null,
+    "canFile": false,
+    "maxFileSize": 1048576,
+    "uploadLink": "/storage/chat",
+    "newMsg":{num: 0,first_id: null}
+}
+},
+methods:{
+ log(name,e){
+  console.log(name,e)
+ }
+}'
+        template='<r-chat style="height:300px" :send-By-Enter="sendByEnter" :placeholder="placeholder" :hide-bottom-btn="hideBottomBtn" :hide-send="hideSend" :max-len-msg="maxLenMsg" :new-msg="newMsg" :participants="participants" :messages="messages" :myself="myself" :title="title" :can-file="canFile" :max-file-size="maxFileSize" :upload-link="uploadLink" @see="log(`see`,$event)" @msg-submit="log(`msg-submit`,$event)" ></r-chat>'
+    ></r-code-editor>
+  </section>
+</template>
+<script>
+export default {
+  name: "chat",
+  data() {
+    return {
+      props: [
+        {
+          prop: "sendByEnter",
+          type: "Boolean",
+          default: "null",
+          description: "Sending a message by pressing the enter key",
+        },
+        {
+          prop: "placeholder",
+          type: "String",
+          default: "type here",
+          description:
+              "The short hint is displayed in the input field before the user enters a value",
+        },
+        {
+          prop: "hideBottomBtn",
+          type: "Boolean",
+          default: "null",
+          description: "hide Bottom Btn",
+        },
+        {
+          prop: "hideSend",
+          type: "Boolean",
+          default: "null",
+          description: "Hide Send",
+        },
+        {
+          prop: "maxLenMsg",
+          type: "Number",
+          default: "200",
+          description: "What is the maximum message length",
+        },
+        {
+          prop: "newMsg",
+          type: "Object",
+          default: "{num: 0,first_id: null}",
+          description: "New Message",
+        },
+        {
+          prop: "participants",
+          type: "Object",
+          default: "undefined",
+          description: "Participants",
+        },
+        {
+          prop: "messages",
+          type: "Array",
+          default: "undefined",
+          description: "Messages",
+        },
+        {
+          prop: "myself",
+          type: "Object",
+          default: "undefined",
+          description: "Your messages",
+        },
+        {
+          prop: "title",
+          type: "String",
+          default: "null",
+          description: "Title",
+        },
+        {
+          prop: "canFile",
+          type: "Boolean",
+          default: "null",
+          description: "File",
+        },
+        {
+          prop: "maxFileSize",
+          type: "Number",
+          default: "1048576",
+          description: "Maximum file size",
+        },
+        {
+          prop: "uploadLink",
+          type: "String",
+          default: "/storage/chat",
+          description: "Upload Link",
+        },
+      ],
+      events: [
+        {event: "see", description: ""},
+        {event: "msg-submit", description: ""},
+      ],
+    };
+  },
+};
+</script>

package/docs/src/views/index/v1/component/chat/fa.vue

@@ -0,0 +1,153 @@
+<template>
+  <section>
+    <div class="color-white mb-2">
+      <h1 class="display-3 font-weight-light color-white ps-4 pb-1 pt-1 br-lg">
+        r-chat
+      </h1>
+      <p class="font-weight-light ps-4 pb-1 py-4 br-lg">
+        این کامپوننت
+        <r-btn readonly size="small"> r-chat</r-btn>
+        به شما اجازه می‌دهد اتاق‌های گفت و گویی بسازید، به آنها ملحق شوید و با
+        استفاده از اموجی، احساسات خود را بیان کنید و برای بارگیری پیام‌های قبلی
+        به بالا اسکرول کنید.
+      </p>
+    </div>
+    <table-props :items="props"></table-props>
+    <table-events :items="events" class="mt-5"></table-events>
+  </section>
+  <section class="mt-10">
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script='data(){
+ return {
+    "sendByEnter": false,
+    "placeholder": "type here",
+    "hideBottomBtn": false,
+    "hideSend": false,
+    "maxLenMsg": 200,
+    "participants": {"1":{"name":"smko","img":"/"},"2":{"name":"pegi","img":"/"},},
+    "messages": [{
+      "type": "text",
+      "content": "hi, Pegi",
+      "_id": "bllfcfdedfa7egkf",
+      "created_at": "2023-08-17T15:55:40.309Z",
+      "user_id":"1"
+    },{
+      "type": "text",
+      "content": "hi, smko",
+      "_id": "bllfcfdedfa7egkm",
+      "created_at": "2023-08-17T15:57:40.309Z",
+      "user_id":"2"
+    }],
+    "myself": {"id":"1","name":"smko","img":"/"},
+    "title": null,
+    "canFile": false,
+    "maxFileSize": 1048576,
+    "uploadLink": "/storage/chat",
+    "newMsg":{num: 0,first_id: null}
+}
+},
+methods:{
+ log(name,e){
+  console.log(name,e)
+ }
+}'
+        template='<r-chat style="height:300px" :send-By-Enter="sendByEnter" :placeholder="placeholder" :hide-bottom-btn="hideBottomBtn" :hide-send="hideSend" :max-len-msg="maxLenMsg" :new-msg="newMsg" :participants="participants" :messages="messages" :myself="myself" :title="title" :can-file="canFile" :max-file-size="maxFileSize" :upload-link="uploadLink" @see="log(`see`,$event)" @msg-submit="log(`msg-submit`,$event)" ></r-chat>'
+    ></r-code-editor>
+  </section>
+</template>
+<script>
+export default {
+  name: "chat",
+  data() {
+    return {
+      props: [
+        {
+          prop: "sendByEnter",
+          type: "Boolean",
+          default: "null",
+          description: "فرستادن پیام با زدن کلید enter",
+        },
+        {
+          prop: "placeholder",
+          type: "String",
+          default: "type here",
+          description:
+              "قبل از اینکه کاربر مقداری را وارد کند، راهنمایی کوتاه در قسمت ورودی نمایش داده می شود.",
+        },
+        {
+          prop: "hideBottomBtn",
+          type: "Boolean",
+          default: "null",
+          description: "مخفی کردن پایین Btn",
+        },
+        {
+          prop: "hideSend",
+          type: "Boolean",
+          default: "null",
+          description: "مخفی کردن فرستادن پیام",
+        },
+        {
+          prop: "maxLenMsg",
+          type: "Number",
+          default: "200",
+          description: "حداکثر طول پیام",
+        },
+        {
+          prop: "newMsg",
+          type: "Object",
+          default: "{num: 0,first_id: null}",
+          description: "پیام جدید",
+        },
+        {
+          prop: "participants",
+          type: "Object",
+          default: "undefined",
+          description: "شركت كنندگان",
+        },
+        {
+          prop: "messages",
+          type: "Array",
+          default: "undefined",
+          description: "پیام ها",
+        },
+        {
+          prop: "myself",
+          type: "Object",
+          default: "undefined",
+          description: "پیام های خودت",
+        },
+        {
+          prop: "title",
+          type: "String",
+          default: "null",
+          description: "عنوان",
+        },
+        {
+          prop: "canFile",
+          type: "Boolean",
+          default: "null",
+          description: "فایل",
+        },
+        {
+          prop: "maxFileSize",
+          type: "Number",
+          default: "1048576",
+          description: "حداکثر حجم فایل",
+        },
+        {
+          prop: "uploadLink",
+          type: "String",
+          default: "/storage/chat",
+          description: "آپلود کردن لینک",
+        },
+      ],
+      events: [
+        {event: "see", description: ""},
+        {event: "msg-submit", description: ""},
+      ],
+    };
+  },
+};
+</script>