Последняя версия с сервера прошлого разработчика

resources/js/Pages/Settings/SettingsPurchasesFile.vue

@@ -0,0 +1,106 @@
+<template>
+  <meta-head title="Скачать медиа контент"></meta-head>
+
+  <div class="xl:container xl:mx-auto px-2 md:px-3">
+    <div class="mt-16 shadow-classic rounded-md bg-indigo-200">
+      <div class="flex flex-col md:grid grid-cols-6 lg:grid-cols-5">
+        <settings-menu />
+
+        <div class="col-span-4 p-5">
+          <div class="mb-4 flex items-center text-gray-light text-lg font-medium">
+            <inertia-link :href="route('setting.purchases')" class="block hover:underline">
+              Вернуться
+            </inertia-link>
+            <span class="px-3">/</span>
+            <h1 class="text-gray">
+              Скачать медиа контент
+            </h1>
+          </div>
+
+          <div class="my-8 flex items-center justify-between">
+            <inertia-link :href="route('profile.user', seller.username)" class="flex items-center">
+              <div class="flex-shrink-0 block mr-2 md:mr-4">
+                <user-avatar :user="seller" size="small"
+                             class="w-10 h-10 md:w-16 md:h-16 text-lg"
+                />
+              </div>
+              <div class="flex flex-col">
+                <span class="text-sm md:text-base block font-medium text-white">{{ seller.name }}</span>
+                <span class="text-xs text-gray-light">продавец</span>
+              </div>
+            </inertia-link>
+
+            <div class="text-right">
+              <p class="mt-2 text-gray-light text-sm">
+                Цена: {{ purchase.price }}
+              </p>
+              <p class="mt-2 text-gray-light text-sm">
+                Дата покупки: {{ purchase.purchase_date }}
+              </p>
+            </div>
+          </div>
+
+
+
+          <div v-if="purchase.title" class="text-lg text-gray font-semibold">
+            {{ purchase.title }}
+          </div>
+          <div v-if="purchase.body" class="text-lg mt-4 text-gray-light"
+               v-html="purchase.body"
+          ></div>
+
+          <div class="mt-4">
+            <component
+              :is="currentTypeNode"
+              :purchase="purchase"
+            ></component>
+          </div>
+
+          <div class="mt-12 flex -mx-3 -my-1 flex-wrap">
+            <a :href="route('download.purchases', purchase.id)" class="mx-3 my-1 transition shadow-none hover:shadow-classic2 inline-flex items-center px-8 py-3 justify-center  text-base rounded-md text-white bg-orange focus:outline-none">
+              Скачать архив
+            </a>
+            <inertia-link :href="route('setting.purchases')"
+                          class="mx-3 my-1 transition shadow-none hover:shadow-classic inline-flex items-center px-8 py-3 justify-center  text-base rounded-md text-white bg-indigo-300 focus:outline-none"
+            >
+              Вернуться
+            </inertia-link>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import Layout from '@/Shared/Layout.vue'
+import MetaHead from '@/Shared/MetaHead.vue'
+import PurchaseImages from '@/Shared/Purchase/PurchaseImages.vue'
+import PurchaseMusics from '@/Shared/Purchase/PurchaseMusics.vue'
+import PurchaseVideos from '@/Shared/Purchase/PurchaseVideos.vue'
+import SettingsMenu from '@/Shared/LayoutParts/SettingsMenu.vue'
+import UserAvatar from '@/Shared/Misc/UserAvatar.vue'
+
+export default {
+    components: {
+        MetaHead,
+        PurchaseImages,
+        PurchaseMusics,
+        PurchaseVideos,
+        SettingsMenu,
+        UserAvatar,
+    },
+    layout: Layout,
+
+    props: {
+        purchase: Object,
+        seller: Object,
+    },
+
+    computed: {
+        currentTypeNode() {
+            return 'purchase-' + this.purchase.type
+        },
+    },
+}
+</script>