renusify 2.1.5 → 2.1.8

package/docs/src/views/index/v1/component/form/unit_input/en.vue

@@ -0,0 +1,200 @@
+<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-unit-input
+      </h1>
+      <p class="font-weight-light ps-4 pb-1 py-4 br-lg">
+        The
+        <r-btn readonly size="small"> r-unit-input</r-btn>
+        component is an
+        input field that is used for singular inputs.
+      </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 {
+    "type": "text",
+    "units": null,
+    "disableInput": false,
+    "disableUnit": false,
+    "autofocus": false,
+    "translate": false
+}
+},
+methods:{
+ log(name,e){
+  console.log(name,e)
+ }
+}'
+        template='<r-unit-input :type="type" :units="units" v-model="modelValue" :disable-Input="disableInput" :disable-Unit="disableUnit" :autofocus="autofocus" :translate="translate" @update:model-Value="log(`update:modelValue`,$event)" ></r-unit-input>'
+    ></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>Units</span>
+    </h1>
+    <section class="pa-4">
+      <r-form v-model="valid">
+        <r-unit-input :units="['grem', 'liter']"></r-unit-input>
+      </r-form>
+    </section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+ return {
+      valid: false,
+
+      info: {},
+
+  }
+}"
+        template='
+  <r-form v-model="valid">
+        <r-unit-input :units="[`grem`, `liter`]"></r-unit-input>
+      </r-form>
+        '
+    ></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>ModelValue</span>
+    </h1>
+    <section class="pa-4">
+      <r-form v-model="valid">
+        <r-unit-input
+            v-model="info.unit"
+            :units="['grem', 'liter']"
+        ></r-unit-input>
+        <r-unique-input :label="$t('Title')"></r-unique-input>
+        <r-text-input :label="$t('Description')"></r-text-input>
+      </r-form>
+    </section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+ return {
+      valid: false,
+      info: {},
+
+  }
+}"
+        template='
+ <r-form v-model="valid">
+        <r-unit-input
+          v-model="info.unit"
+          :units="[`grem`, `liter`]"
+        ></r-unit-input>
+        <r-unique-input :label="$t(`Title`)"></r-unique-input>
+        <r-text-input :label="$t(`Description`)"></r-text-input>
+        <r-switch-input readonly v-model="info.active"></r-switch-input>
+      </r-form>
+        '
+    ></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>disableUnit</span>
+    </h1>
+    <section class="pa-4">
+      <r-form v-model="valid">
+        <r-unit-input
+            v-model="info.unit"
+            :units="['grem', 'liter']"
+            disableUnit
+        ></r-unit-input>
+        <r-switch-input v-model="info.active"></r-switch-input>
+      </r-form>
+    </section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+ return {
+      valid: false,
+      info: {},
+
+  }
+}"
+        template='
+ <r-form v-model="valid">
+        <r-unit-input
+          v-model="info.unit"
+          :units="[`grem`, `liter`]"
+        ></r-unit-input>
+        <r-unique-input :label="$t(`Title`)"></r-unique-input>
+        <r-text-input :label="$t(`Description`)"></r-text-input>
+        <r-switch-input readonly v-model="info.active"></r-switch-input>
+      </r-form>
+        '
+    ></r-code-editor>
+  </section>
+  <br/>
+  <br/>
+</template>
+<script>
+export default {
+  name: "unit_input",
+  data() {
+    return {
+      valid: false,
+      info: {},
+      props: [
+        {prop: "type", type: "String", default: "text", description: "Type"},
+        {
+          prop: "units",
+          type: "Array",
+          default: "undefined",
+          description: "Units",
+        },
+        {
+          prop: "modelValue",
+          type: "Object",
+          default: "{value: null,unit: null}",
+          description: "Model Value",
+        },
+        {
+          prop: "disableInput",
+          type: "Boolean",
+          default: "null",
+          description: "Disable Input",
+        },
+        {
+          prop: "disableUnit",
+          type: "Boolean",
+          default: "null",
+          description: "Disable Unit",
+        },
+        {
+          prop: "autofocus",
+          type: "Boolean",
+          default: "null",
+          description: "Auto Focus",
+        },
+        {
+          prop: "translate",
+          type: "Boolean",
+          default: "null",
+          description: "Translate",
+        },
+      ],
+      events: [{event: "update:modelValue", description: ""}],
+    };
+  },
+};
+</script>

package/docs/src/views/index/v1/component/form/unit_input/fa.vue

@@ -0,0 +1,203 @@
+<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-unit-input
+      </h1>
+      <p class="font-weight-light ps-4 pb-1 py-4 br-lg">
+        کامپوننت
+        <r-btn readonly size="small"> r-unit-input</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 {
+    "type": "text",
+    "units": ["grem","liter"],
+    "disableInput": false,
+    "disableUnit": false,
+    "autofocus": false,
+    "translate": false
+}
+},
+methods:{
+ log(name,e){
+  console.log(name,e)
+ }
+}'
+        template='<r-unit-input :type="type" :units="units" v-model="modelValue" :disable-Input="disableInput" :disable-Unit="disableUnit" :autofocus="autofocus" :translate="translate" @update:model-Value="log(`update:modelValue`,$event)" ></r-unit-input>'
+    ></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>Units</span>
+    </h1>
+    <section class="pa-4">
+      <r-form v-model="valid">
+        <r-unit-input :units="['grem', 'liter']"></r-unit-input>
+      </r-form>
+    </section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+ return {
+      valid: false,
+      info: {},
+
+  }
+}"
+        template='
+  <r-form v-model="valid">
+        <r-unit-input :units="[`grem`, `liter`]"></r-unit-input>
+      </r-form>
+        '
+    ></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>ModelValue</span>
+    </h1>
+    <section class="pa-4">
+      <r-form v-model="valid">
+        <r-unit-input
+            v-model="info.unit"
+            :units="['grem', 'liter']"
+        ></r-unit-input>
+        <r-unique-input :label="$t('Title')"></r-unique-input>
+        <r-text-input :label="$t('Description')"></r-text-input>
+      </r-form>
+    </section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+ return {
+      valid: false,
+      info: {},
+
+  }
+}"
+        template='
+ <r-form v-model="valid">
+        <r-unit-input
+          v-model="info.unit"
+          :units="[`grem`, `liter`]"
+        ></r-unit-input>
+        <r-unique-input :label="$t(`Title`)"></r-unique-input>
+        <r-text-input :label="$t(`Description`)"></r-text-input>
+        <r-switch-input readonly v-model="info.active"></r-switch-input>
+      </r-form>
+        '
+    ></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>disableUnit</span>
+    </h1>
+    <section class="pa-4">
+      <r-form v-model="valid">
+        <r-unit-input
+            v-model="info.unit"
+            :units="['grem', 'liter']"
+            disableUnit
+        ></r-unit-input>
+        <r-switch-input v-model="info.active"></r-switch-input>
+      </r-form>
+    </section>
+    <p class="caption">Press run Button</p>
+    <r-code-editor
+        runnable
+        script="data(){
+ return {
+      valid: false,
+      info: {},
+
+  }
+}"
+        template='
+ <r-form v-model="valid">
+        <r-unit-input
+          v-model="info.unit"
+          :units="[`grem`, `liter`]"
+        ></r-unit-input>
+        <r-unique-input :label="$t(`Title`)"></r-unique-input>
+        <r-text-input :label="$t(`Description`)"></r-text-input>
+        <r-switch-input readonly v-model="info.active"></r-switch-input>
+      </r-form>
+        '
+    ></r-code-editor>
+  </section>
+  <br/>
+  <br/>
+</template>
+<script>
+export default {
+  name: "unit_input",
+  data() {
+    return {
+      valid: false,
+      info: {},
+      props: [
+        {
+          prop: "type",
+          type: "String",
+          default: "text",
+          description: "نوع تایپ",
+        },
+        {
+          prop: "units",
+          type: "Array",
+          default: "undefined",
+          description: "واحد ",
+        },
+        {
+          prop: "modelValue",
+          type: "Object",
+          default: "{value: null,unit: null}",
+          description: "Model Value می گیرد ",
+        },
+        {
+          prop: "disableInput",
+          type: "Boolean",
+          default: "null",
+          description: "غیر فعال کردن Input",
+        },
+        {
+          prop: "disableUnit",
+          type: "Boolean",
+          default: "null",
+          description: "غیر فعال کردن Unit",
+        },
+        {
+          prop: "autofocus",
+          type: "Boolean",
+          default: "null",
+          description: "فوکوس خودکار",
+        },
+        {
+          prop: "translate",
+          type: "Boolean",
+          default: "null",
+          description: "ترجمه شود یا نه",
+        },
+      ],
+      events: [{event: "update:modelValue", description: ""}],
+    };
+  },
+};
+</script>

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

@@ -0,0 +1,181 @@
+<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>
+        It creates forms
+        automatically.
+      </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: "The Url to which the form is sent.",
+        },
+        {
+          prop: "title",
+          type: "String",
+          default: "Add form",
+          description: "A title can be called",
+        },
+        {
+          prop: "autoSend",
+          type: "Boolean",
+          default: "null",
+          description: "Should it be sent automatically or not.",
+        },
+        {
+          prop: "redirect",
+          type: "String",
+          default: "undefined",
+          description: "it is way to redirect to another webpage ",
+        },
+        {
+          prop: "method",
+          type: "String",
+          default: "post",
+          description: "method form",
+        },
+        {
+          prop: "options",
+          type: "Object,Array",
+          default: "undefined",
+          description: "We can determine the type of data.",
+        },
+        {
+          prop: "modelValue",
+          type: "Object",
+          default: "{}",
+          description: "If the form are it becomes true.",
+        },
+        {
+          prop: "headers",
+          type: "Object",
+          default: "null",
+          description: "Header form",
+        },
+      ],
+      events: [
+        {event: "update:modelValue", description: ""},
+        {event: "ok", description: ""},
+      ],
+    };
+  },
+};
+</script>