fixed #28

src/components/Widgets/Content/AdminContentShow/AdminContentShow.vue

@@ -53,7 +53,7 @@ export default {
         { type: ContentCategorySelectorComp, name: 'category', responseKey: 'category_info', col: 'col-md-12 col-12' },
         { type: 'inputEditor', name: 'description', responseKey: 'description', label: 'توضیحات', col: 'col-md-12 col-12' },
         { type: ContentMediasComp, name: 'medias', responseKey: 'medias_info', col: 'col-md-12 col-12' },
-        { type: BtnControlComp, name: 'btn', responseKey: 'btn', label: 'ویرایش محتوا', placeholder: ' ', atClick: () => {}, col: 'col-md-6' }
+        { type: BtnControlComp, name: 'btn', responseKey: 'btn', label: 'ویرایش محتوا', placeholder: ' ', ignoreValue: true, atClick: () => {}, col: 'col-md-6' }
       ]
     }
   },

src/components/Widgets/Payment/PaymentList/PaymentList.vue

@@ -16,7 +16,7 @@
       <template #entity-index-table-cell="{inputData}">
         <template v-if="inputData.col.name === 'action'">
           <q-btn color="primary"
-                 :to="{name: 'UserPanel.Invoice.Show', params: {id: inputData.props.row.id}}">
+                 :to="{name: 'UserPanel.Payment.Show', params: {id: inputData.props.row.id}}">
             مشاهده جزییات
           </q-btn>
         </template>
@@ -29,7 +29,7 @@
           <template #col="{col, row}">
             <template v-if="col.name === 'action'">
               <q-btn color="primary"
-                     :to="{name: 'UserPanel.Invoice.Show', params: {id: row.id}}">
+                     :to="{name: 'UserPanel.Payment.Show', params: {id: row.id}}">
                 مشاهده جزییات
               </q-btn>
             </template>

src/components/Widgets/Payment/PaymentShow/OptionPanel.vue

@@ -0,0 +1,21 @@
+<template>
+  <option-panel-tabs v-model:options="localOptions">
+    <template #main-tab>
+      ...
+    </template>
+  </option-panel-tabs>
+</template>
+
+<script>
+import { defineComponent } from 'vue'
+import { mixinOptionPanel } from 'quasar-ui-q-page-builder'
+import OptionPanelTabs from 'quasar-ui-q-page-builder/src/components/OptionPanelComponents/OptionPanelTabs.vue'
+
+export default defineComponent({
+  name: 'OptionPanel',
+  components: {
+    OptionPanelTabs
+  },
+  mixins: [mixinOptionPanel]
+})
+</script>

src/components/Widgets/Payment/PaymentShow/PaymentShow.vue

@@ -0,0 +1,152 @@
+<template>
+  <div class="PaymentShow"
+       :style="localOptions.style">
+    <entity-show v-if="mounted"
+                 ref="entityEdit"
+                 v-model:value="inputs"
+                 title="اطلاعات پرداخت"
+                 :api="api"
+                 :entity-id-key="entityIdKey"
+                 :index-route-name="'UserPanel.Wallet'"
+                 :show-close-button="false"
+                 :show-edit-button="false"
+                 :show-expand-button="false"
+                 :show-save-button="false"
+                 :show-reload-button="false"
+                 :redirect-after-edit="false"
+                 :after-load-input-data="afterLoadInputData">
+      <template #after-form-builder>
+        <q-btn v-if="payment.invoice_info?.id"
+               class="full-width q-mt-md"
+               color="primary"
+               @click="showInvoice">
+          مشاهده سفارش
+        </q-btn>
+      </template>
+    </entity-show>
+  </div>
+</template>
+
+<script>
+import { EntityShow } from 'quasar-crud'
+import { Payment } from 'src/models/Payment.js'
+import { mixinWidget } from 'src/mixin/Mixins.js'
+import { APIGateway } from 'src/api/APIGateway.js'
+
+export default {
+  name: 'PaymentShow',
+  components: {
+    EntityShow
+  },
+  mixins: [mixinWidget],
+  data: () => {
+    return {
+      mounted: false,
+      entityLoading: true,
+      api: null,
+      payment: new Payment(),
+      entityIdKey: 'id',
+      entityParamKey: 'id',
+      showRouteName: 'Admin.Content.Show',
+      indexRouteName: 'Admin.Content.List',
+      inputs: [
+        { type: 'input', name: 'amount', responseKey: 'amount', label: 'مبلغ', placeholder: ' ', col: 'col-md-4 col-12' },
+        { type: 'dateTime', name: 'creation_time', responseKey: 'creation_time', label: 'تاریخ ایجاد', placeholder: ' ', col: 'col-md-4 col-12' },
+        {
+          type: 'select',
+          name: 'type',
+          responseKey: 'type',
+          label: 'نوع',
+          options: [
+            {
+              label: 'برداشت',
+              value: 'WITHDRAW'
+            },
+            {
+              label: 'درخواست برداشت',
+              value: 'WITHDRAW_REQUEST'
+            },
+            {
+              label: 'برداشت رد شده',
+              value: 'WITHDRAW_REJECT'
+            },
+            {
+              label: 'واریز',
+              value: 'DEPOSIT'
+            }
+          ],
+          placeholder: ' ',
+          col: 'col-md-4 col-12'
+        },
+        { type: 'input', name: 'creator_info.firstname', responseKey: 'creator_info.firstname', label: 'نام پرداخت کننده', placeholder: ' ', col: 'col-md-6 col-12' },
+        { type: 'input', name: 'creator_info.lastname', responseKey: 'creator_info.lastname', label: 'نام خانوادگی پرداخت کننده', placeholder: ' ', col: 'col-md-6 col-12' }
+      ]
+    }
+  },
+  created() {
+    this.api = APIGateway.payment.APIAdresses.byId(this.$route.params.id)
+  },
+  mounted() {
+    this.mounted = true
+  },
+  methods: {
+    showInvoice () {
+      const routeData = this.$router.resolve({ name: 'UserPanel.Invoice.Show', params: { id: this.payment.invoice_info.id } })
+      window.open(routeData.href, '_blank')
+    },
+    setActionBtn () {
+      this.inputs.forEach((item, index) => {
+        if (item.name === 'btn') {
+          this.inputs[index].atClick = this.edit
+        }
+      })
+    },
+    afterLoadInputData (data) {
+      this.payment = new Payment(data)
+      this.entityLoading = false
+    },
+    edit() {
+      this.entityLoading = true
+      this.$refs.entityEdit.editEntity(false)
+        .then(() => {
+          this.$refs.entityEdit.getData()
+          this.entityLoading = false
+        })
+        .catch(() => {
+          this.$refs.entityEdit.getData()
+          this.entityLoading = false
+        })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.PaymentShow {
+  .title {
+    font-style: normal;
+    font-weight: 700;
+    font-size: 24px;
+    line-height: 140%;
+    color: #424242;
+    margin-bottom: 27px;
+    display: flex;
+    flex-flow: row;
+    position: relative;
+    .static-title {
+
+    }
+    .dynamic-title {
+
+    }
+    .back-action {
+      position: absolute;
+      right: 0;
+      top: 0;
+    }
+  }
+  :deep(.form) {
+    padding: 24px;
+  }
+}
+</style>

src/pages/User/Payment/Show.vue

@@ -0,0 +1,24 @@
+<template>
+  <q-page-builder v-model:sections="currenSections"
+                  v-model:options="pageConfig"
+                  :editable="pageBuilderEditable"
+                  :loading="pageBuilderLoading" />
+</template>
+
+<script>
+import { mixinPageOptions } from 'src/mixin/Mixins.js'
+
+export default {
+  name: 'AdminPanel.Package.Show',
+  mixins: [mixinPageOptions],
+  data: () => {
+    return {
+      sections: [{ data: { rows: [{ cols: [{ widgets: [{ name: 'PaymentShow' }], options: { style: { paddingTop: '124px' } } }], options: { className: '', height: 'auto', boxed: true, boxedWidth: 1200, gutterXSize: 'md', gutterYSize: 'md', absolute: 'none', paddingOfBoxedInFullWidth: '30px', style: { maxWidth: '1200px', width: '1200px' } } }] } }]
+    }
+  },
+  created() {
+    this.currenSections = this.sections
+    this.pageBuilderLoading = false
+  }
+}
+</script>

src/router/routes.js

@@ -240,6 +240,22 @@ const routes = [
             path: 'wallet',
             name: 'UserPanel.Wallet',
             component: () => import('src/pages/User/Wallet/Show.vue')
+          },
+          {
+            path: 'payment',
+            name: 'UserPanel.Payment',
+            component: () => import('src/layouts/bareLayout.vue'),
+            children: [
+              {
+                name: 'UserPanel.Payment.Show',
+                path: ':id',
+                component: () => import('src/pages/User/Payment/Show.vue'),
+                meta: {
+                  hasDynamicSetting: true
+                },
+                breadcrumbs: { title: 'اطلاعات کاربری' }
+              }
+            ]
           }
         ]
       },