renusify 2.1.5 → 2.1.8

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

@@ -0,0 +1,179 @@
+<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-form-creator
+      </h1>
+      <p class="font-weight-light ps-4 pb-1 py-4 br-lg">
+        <r-btn readonly size="small"> r-form-creator</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 {
+    "url": null,
+    "title": "Add form",
+    "autoSend": false,
+    "redirect": null,
+    "method": "post",
+    "headers": null,
+    "options": {
+      name:{"type": "r-text-input","props":{"rules": ["required"]}},
+      family:{"type": "r-text-input","props":{"rules": ["required"]}},
+      age:{"type": "r-number-input",$if:[["$name","!=","$family"]],"props":{"rules": ["required","min:7","max:70"]}},
+      phone:{"type": "r-mask-input",$if:[["$age",">",7],["$age","<=",60]],"props":{"rules": ["required"],"mask": "0NNN NNN NNNN"}},
+      mix:{"type": "r-text-input","$bind":[["label","name"]]},
+     }
+}
+},
+methods:{
+ log(name,e){
+  console.log(name,e)
+ }
+}'
+        template='<r-form-creator :url="url" :title="title" :auto-Send="autoSend" :redirect="redirect" :method="method" :options="options" v-model="modelValue" :headers="headers" @update:model-Value="log(`update:modelValue`,$event)" @ok="log(`ok`,$event)" ></r-form-creator>'
+    ></r-code-editor>
+  </section>
+  <br/>
+  <br/>
+  <section class="pa-3 color-white">
+    <h1 class="font-weight-bold title ps-4 pt-1 pb-1 br-sm">
+      PROP / <span>Title</span>
+    </h1>
+    <section>
+      <r-card>
+        <r-form-creator title="title Form"></r-form-creator>
+      </r-card>
+    </section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+ return {
+  }
+}"
+        template='  <r-card>
+        <r-form-creator title="title Form"> </r-form-creator>
+      </r-card>'
+    ></r-code-editor>
+  </section>
+  <br/>
+  <br/>
+  <section class="pa-3 color-white">
+    <h1 class="font-weight-bold title ps-4 pt-1 pb-1 br-sm">
+      PROP / <span>Url</span>
+    </h1>
+    <section>
+      <r-card>
+        <r-form-creator title="title Form" url="url"></r-form-creator>
+      </r-card>
+    </section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+ return {
+  }
+}"
+        template='  <r-card>
+        <r-form-creator title="title Form"  url="url"> </r-form-creator>
+      </r-card>'
+    ></r-code-editor>
+  </section>
+  <br/>
+  <br/>
+  <section class="pa-3 color-white">
+    <h1 class="font-weight-bold title ps-4 pt-1 pb-1 br-sm">
+      PROP / <span>Method</span>
+    </h1>
+    <section>
+      <r-card>
+        <r-form-creator method="post" title="title Form" url="url">
+        </r-form-creator>
+      </r-card>
+    </section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+ return {
+  }
+}"
+        template='  <r-card>
+        <r-form-creator method="post"  title="title Form"  url="url"> </r-form-creator>
+      </r-card>'
+    ></r-code-editor>
+  </section>
+  <br/>
+  <br/>
+</template>
+<script>
+export default {
+  name: "form_creator",
+  data() {
+    return {
+      props: [
+        {
+          prop: "url",
+          type: "String",
+          default: "undefined",
+          description: "url که فرم را به آن ارسال می کند . ",
+        },
+        {
+          prop: "title",
+          type: "String",
+          default: "Add form",
+          description: "یک عنوان می تواند بگیرد ",
+        },
+        {
+          prop: "autoSend",
+          type: "Boolean",
+          default: "null",
+          description: "بصورت خودکار ارسال شود یا نه .",
+        },
+        {
+          prop: "redirect",
+          type: "String",
+          default: "undefined",
+          description: "این راهی برای هدایت کردن به صفحه دیگر است",
+        },
+        {
+          prop: "method",
+          type: "String",
+          default: "post",
+          description: "متد های فرم",
+        },
+        {
+          prop: "options",
+          type: "Object,Array",
+          default: "undefined",
+          description: "نوع داده ها را می توانیم مشخص کنیم .",
+        },
+        {
+          prop: "modelValue",
+          type: "Object",
+          default: "{}",
+          description: "مقدار فرم را برمی گرداند.",
+        },
+        {
+          prop: "headers",
+          type: "Object",
+          default: "null",
+          description: "هدر ارسال فرم",
+        },
+      ],
+      events: [
+        {event: "update:modelValue", description: ""},
+        {event: "ok", description: ""},
+      ],
+    };
+  },
+};
+</script>

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

@@ -0,0 +1,215 @@
+<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-html2pdf
+      </h1>
+      <p class="font-weight-light ps-4 pb-1 py-4 br-lg">
+        <r-btn readonly size="small"> r-html2pdf</r-btn>
+        It converts each HTML page or element into a printable PDF file.
+      </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 {
+    "enableDownload": true,
+    "enableLinks": true,
+    "previewModal": false,
+    "filename": "1692260878768",
+    "pdfQuality": 2,
+    "pdfFormat": "a4",
+    "pdfOrientation": "portrait",
+    "pdfContentWidth": "800px",
+    "htmlToPdfOptions": null,
+    "pageBreakAuto": null,
+    "toInlineCss": false,
+    "avoidClass": null,
+    "beforeClass": null,
+    "afterClass": null
+}
+},
+methods:{
+ log(name,e){
+  console.log(name,e)
+ }
+}'
+        template='<r-html2pdf :enable-Download="enableDownload" :enable-Links="enableLinks" :preview-Modal="previewModal" :filename="filename" :pdf-Quality="pdfQuality" :pdf-Format="pdfFormat" :pdf-Orientation="pdfOrientation" :pdf-Content-Width="pdfContentWidth" :html-To-Pdf-Options="htmlToPdfOptions" :page-Break-Auto="pageBreakAuto" :to-Inline-Css="toInlineCss" :avoid-Class="avoidClass" :before-Class="beforeClass" :after-Class="afterClass" @progress="log(`progress`,$event)" @has-downloaded="log(`has-downloaded`,$event)" @before-download="log(`before-download`,$event)" ></r-html2pdf>'
+    ></r-code-editor>
+  </section>
+  <br/>
+  <br/>
+  <section class="color-white">
+    <h1 class="font-weight-bold title ps-4 pt-1 pb-1 br-sm">html2pdf</h1>
+    <r-divider></r-divider>
+    <section>
+      <div class="pa-4">
+        <r-html2pdf
+            ref="html2pdf_aid"
+            :enableDownload="true"
+            :pdf-quality="2"
+            avoid-class=".item-print"
+            filename="aid"
+            pdf-content-width="208mm"
+            pdf-orientation="portrait"
+            toInlineCss
+            @progress="checkCode($event)"
+        >
+          <div class="my-2">
+            <h4 class="pb-4">title</h4>
+            <span>
+              Lorem ipsum dolor sit amet, consectetur adipisicing elit.
+            </span>
+          </div>
+        </r-html2pdf>
+        <r-btn class="color-success" @click="save">Pdf</r-btn>
+      </div>
+    </section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+ return {
+  }
+},
+ methods: {
+    save() {
+      this.$refs.html2pdf_aid.buildPdf();
+    },
+  },
+"
+        template='  <div class="pa-4 text-center">
+        <r-btn class="color-info" @click="save">Pdf</r-btn>
+        <r-html2pdf
+          :enableDownload="true"
+          filename="aid"
+          :pdf-quality="2"
+          pdf-orientation="portrait"
+          pdf-content-width="208mm"
+          @progress="checkCode($event)"
+          avoid-class=".item-print"
+          toInlineCss
+          ref="html2pdf_aid"
+        >
+          <div class="text-center pa-4">
+            <h4 class="pb-4">title</h4>
+            <p>
+              Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore
+              dolorum quibusdam repudiandae ut voluptates.
+            </p>
+          </div>
+        </r-html2pdf>
+      </div>'
+    ></r-code-editor>
+  </section>
+</template>
+<script>
+export default {
+  name: "html2pdf",
+  data() {
+    return {
+      props: [
+        {
+          prop: "enableDownload",
+          type: "Boolean",
+          default: "true",
+          description: "Enable download.",
+        },
+        {
+          prop: "enableLinks",
+          type: "Boolean",
+          default: "true",
+          description: "Enable Link.",
+        },
+        {
+          prop: "previewModal",
+          type: "Boolean",
+          default: "false",
+          description: " Preview Modal.",
+        },
+        {
+          prop: "filename",
+          type: "String",
+          default: "1692260878768",
+          description: "File Name",
+        },
+        {
+          prop: "pdfQuality",
+          type: "Number",
+          default: "2",
+          description: "Pdf Quality",
+        },
+        {
+          prop: "pdfFormat",
+          type: "undefined",
+          default: "a4",
+          description: "size pdf format",
+        },
+        {
+          prop: "pdfOrientation",
+          type: "String",
+          default: "portrait",
+          description: "PDF Orientation",
+        },
+        {
+          prop: "pdfContentWidth",
+          type: "undefined",
+          default: "800px",
+          description: "Pdf Content Width",
+        },
+        {
+          prop: "htmlToPdfOptions",
+          type: "Object",
+          default: "undefined",
+          description: "html To Pdf Options",
+        },
+        {
+          prop: "pageBreakAuto",
+          type: "Number",
+          default: "null",
+          description: "Opening a new page automatically.",
+        },
+        {
+          prop: "toInlineCss",
+          type: "Boolean",
+          default: "null",
+          description: "To In line Css",
+        },
+        {
+          prop: "avoidClass",
+          type: "String",
+          default: "null",
+          description: "Avoid Class",
+        },
+        {
+          prop: "beforeClass",
+          type: "String",
+          default: "null",
+          description: "Before Class",
+        },
+        {
+          prop: "afterClass",
+          type: "String",
+          default: "null",
+          description: "After Class",
+        },
+      ],
+      events: [
+        {event: "progress", description: ""},
+        {event: "has-downloaded", description: ""},
+        {event: "before-download", description: ""},
+      ],
+    };
+  },
+  methods: {
+    save() {
+      this.$refs.html2pdf_aid.buildPdf();
+    },
+  },
+};
+</script>

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

@@ -0,0 +1,226 @@
+<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-html2pdf
+      </h1>
+      <p class="font-weight-light ps-4 pb-1 py-4 br-lg">
+        <r-btn readonly size="small"> r-html2pdf</r-btn>
+        هر صفحه و یا المان HTML را به یک فایل PDF قابل چاپ تبدیل می کند.
+      </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 {
+    "enableDownload": true,
+    "enableLinks": true,
+    "previewModal": false,
+    "filename": "1692260878768",
+    "pdfQuality": 2,
+    "pdfFormat": "a4",
+    "pdfOrientation": "portrait",
+    "pdfContentWidth": "800px",
+    "htmlToPdfOptions": null,
+    "pageBreakAuto": null,
+    "toInlineCss": false,
+    "avoidClass": null,
+    "beforeClass": null,
+    "afterClass": null
+}
+},
+methods:{
+ log(name,e){
+  console.log(name,e)
+ },
+ save() {
+      this.$refs.html2pdf_aid.buildPdf();
+    }
+}'
+        template='<r-html2pdf ref="html2pdf_aid" :enable-Download="enableDownload" :enable-Links="enableLinks" :preview-Modal="previewModal" :filename="filename" :pdf-Quality="pdfQuality" :pdf-Format="pdfFormat" :pdf-Orientation="pdfOrientation" :pdf-Content-Width="pdfContentWidth" :html-To-Pdf-Options="htmlToPdfOptions" :page-Break-Auto="pageBreakAuto" :to-Inline-Css="toInlineCss" :avoid-Class="avoidClass" :before-Class="beforeClass" :after-Class="afterClass" @progress="log(`progress`,$event)" @has-downloaded="log(`has-downloaded`,$event)" @before-download="log(`before-download`,$event)" >
+        <h1>title</h1>
+        <p class="color-error pa-5"> this is test</p>
+      </r-html2pdf>
+      <r-btn @click="save">save</r-btn>'
+    ></r-code-editor>
+  </section>
+  <br/>
+  <br/>
+  <section class="color-white">
+    <h1 class="font-weight-bold title ps-4 pt-1 pb-1 br-sm">html2pdf</h1>
+    <r-divider></r-divider>
+    <section>
+      <div class="pa-4">
+        <r-html2pdf
+            ref="html2pdf_aid"
+            :enableDownload="true"
+            :pdf-quality="2"
+            avoid-class=".item-print"
+            filename="aid"
+            pdf-content-width="208mm"
+            pdf-orientation="portrait"
+            toInlineCss
+            @progress="onProgress($event)"
+        >
+          <div class="my-2">
+            <h4 class="pb-4">title</h4>
+            <span>
+              Lorem ipsum dolor sit amet, consectetur adipisicing elit.
+            </span>
+          </div>
+        </r-html2pdf>
+        <r-btn class="color-success" @click="save">Pdf</r-btn>
+      </div>
+    </section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+ return {
+  }
+},
+ methods: {
+    save() {
+      this.$refs.html2pdf_aid.buildPdf();
+    },
+  },
+"
+        template='  <div class="pa-4 text-center">
+        <r-btn class="color-info" @click="save">Pdf</r-btn>
+        <r-html2pdf
+          :enableDownload="true"
+          filename="aid"
+          :pdf-quality="2"
+          pdf-orientation="portrait"
+          pdf-content-width="208mm"
+          avoid-class=".item-print"
+          toInlineCss
+          ref="html2pdf_aid"
+        >
+          <div class="text-center pa-4">
+            <h4 class="pb-4">title</h4>
+            <p>
+              Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolore
+              dolorum quibusdam repudiandae ut voluptates.
+            </p>
+          </div>
+        </r-html2pdf>
+      </div>'
+    ></r-code-editor>
+  </section>
+</template>
+<script>
+export default {
+  name: "html2pdf",
+  data() {
+    return {
+      props: [
+        {
+          prop: "enableDownload",
+          type: "Boolean",
+          default: "true",
+          description: "دانلود کردن را فعال کنید",
+        },
+        {
+          prop: "enableLinks",
+          type: "Boolean",
+          default: "true",
+          description: "لینک دادن را فعال کنید",
+        },
+        {
+          prop: "previewModal",
+          type: "Boolean",
+          default: "false",
+          description: "پیش نمایش Modal",
+        },
+        {
+          prop: "filename",
+          type: "String",
+          default: "1692260878768",
+          description: "نام فایل",
+        },
+        {
+          prop: "pdfQuality",
+          type: "Number",
+          default: "2",
+          description: "کیفیت pdf",
+        },
+        {
+          prop: "pdfFormat",
+          type: "undefined",
+          default: "a4",
+          description: "اندازه فرمت pdf",
+        },
+        {
+          prop: "pdfOrientation",
+          type: "String",
+          default: "portrait",
+          description: "جهت نمایش Pdf",
+        },
+        {
+          prop: "pdfContentWidth",
+          type: "undefined",
+          default: "800px",
+          description: "جهت گیری pdf",
+        },
+        {
+          prop: "htmlToPdfOptions",
+          type: "Object",
+          default: "undefined",
+          description: "گزینه های تبدیل HTML به PDF",
+        },
+        {
+          prop: "pageBreakAuto",
+          type: "Number",
+          default: "null",
+          description: "باز شدن صفحه جدید بصورت خودکار",
+        },
+        {
+          prop: "toInlineCss",
+          type: "Boolean",
+          default: "null",
+          description: " CSS درون خطی",
+        },
+        {
+          prop: "avoidClass",
+          type: "String",
+          default: "null",
+          description: "اجتناب از کلاس ",
+        },
+        {
+          prop: "beforeClass",
+          type: "String",
+          default: "null",
+          description: "کلاسهای پیشین",
+        },
+        {
+          prop: "afterClass",
+          type: "String",
+          default: "null",
+          description: "کلاسهای پسین",
+        },
+      ],
+      events: [
+        {event: "progress", description: ""},
+        {event: "has-downloaded", description: ""},
+        {event: "before-download", description: ""},
+      ],
+    };
+  },
+  methods: {
+    onProgress(progress) {
+      this.progress = progress;
+
+      console.log(`PDF generation progress: ${progress}%`);
+    },
+    save() {
+      this.$refs.html2pdf_aid.buildPdf();
+    },
+  },
+};
+</script>

package/docs/src/views/index/v1/component/html2pdf/html2pdf_page_break/en.vue

@@ -0,0 +1,37 @@
+<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-html2pdf-page-break
+      </h1>
+      <p class="font-weight-light ps-4 pb-1 py-4 br-lg">
+        The page always breaks after the
+        <r-btn readonly size="small"> r-html2pdf-page-break</r-btn>
+        element and
+        redirects to another page.
+      </p>
+    </div>
+
+    <table-props :items="items"></table-props>
+  </section>
+  <section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+ return {}
+}"
+        template="<r-html2pdf-page-break ></r-html2pdf-page-break>"
+    ></r-code-editor>
+  </section>
+</template>
+<script>
+export default {
+  name: "html2pdf_page_break",
+  data() {
+    return {
+      items: [],
+    };
+  },
+};
+</script>

package/docs/src/views/index/v1/component/html2pdf/html2pdf_page_break/fa.vue

@@ -0,0 +1,36 @@
+<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-html2pdf-page-break
+      </h1>
+      <p class="font-weight-light ps-4 pb-1 py-4 br-lg">
+        همیشه بعداز عنصر
+        <r-btn readonly size="small"> r-html2pdf-page-break</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 {}
+}"
+        template="<r-html2pdf-page-break ></r-html2pdf-page-break>"
+    ></r-code-editor>
+  </section>
+</template>
+<script>
+export default {
+  name: "html2pdf_page_break",
+  data() {
+    return {
+      items: [],
+    };
+  },
+};
+</script>