Teeaseer/site
2
1
Fork 0
Code Issues 7 Pull Requests Projects 1 Activity

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

Browse Source
This commit is contained in:
MIRZAEV
2025-07-10 04:35:51 +00:00
commit c731570032
1174 changed files with 134314 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

358
resources/js/Pages/Settings/SettingsProfile.vue Executable file
View File

@@ -0,0 +1,358 @@
<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">
<div class="m-4 lg:m-8">
<div class="flex flex-col xl:flex-row">
<div class="xl:mr-24">
<div class="flex items-center">
<div class="flex-shrink-0 mr-5">
<user-avatar :user="user" class="w-20 h-20 text-lg" />
</div>
<div class="flex flex-col">
<p class="text-base lg:text-xl font-semibold text-gray">
{{ user.name }}
</p>
<p class="lg:mt-1 text-base text-gray-light">
@{{ user.username }}
</p>
</div>
</div>
<input ref="fileavatar" class="hidden"
accept="image/png, image/jpeg, image/jpg" type="file"
@change="previewFiles"
>
<input ref="filebanner" class="hidden"
accept="image/png, image/jpeg, image/jpg" type="file"
@change="previewFilesBanner"
>
<div>
<div v-if="$page.props.errors.avatar" class="text-red lg:text-lg">
{{ $page.props.errors.avatar }}
</div>
<button v-if="!user.photo_path" class="hover:underline mt-2 text-left lg:mt-5 default lg:text-lg text-orange"
@click="changeAvatar"
>
Изменить фото профиля
</button>
<button v-else class="hover:underline mt-2 text-left lg:mt-5 default lg:text-lg text-red"
@click="removeAvatar"
>
Удалить фото
</button>
</div>
</div>
<div class="mt-5 xl:mt-0">
<div class="flex items-center">
<div class="flex-shrink-0 mr-5">
<user-banner class="w-60 lg:w-96 h-20 rounded-xl bg-indigo-300" :user="user"
size="banner"
/>
</div>
</div>
<div>
<div v-if="$page.props.errors.banner" class="text-red lg:text-lg">
{{ $page.props.errors.banner }}
</div>
<button v-if="!user.banner_path" class="hover:underline mt-2 text-left lg:mt-5 default lg:text-lg text-orange"
@click="changeBanner"
>
Изменить баннер профиля
</button>
<button v-else class="hover:underline mt-2 text-left lg:mt-5 default lg:text-lg text-red"
@click="removeBanner"
>
Удалить баннер
</button>
</div>
</div>
</div>
<form class="border-b border-indigo-400 pb-10 mt-10 grid grid-cols-1 lg:grid-cols-2 2xl:grid-cols-7 gap-5 lg:gap-10 items-start" @submit.prevent="submitPassword">
<div class="2xl:col-span-3 flex flex-col">
<text-input v-model="passwordForm.old_password" :error="passwordForm.errors.old_password"
class="focus:ring-4 focus:ring-offset-1 focus:ring-orange focus:ring-opacity-20 focus:ring-offset-orange focus:border-transparent text-gray border border-indigo-300 bg-indigo-200 rounded-md placeholder-gray-light" label="Старый пароль"
type="password"
/>
</div>
<div class="2xl:col-span-3 flex flex-col">
<text-input v-model="passwordForm.new_password" :error="passwordForm.errors.new_password"
class="focus:ring-4 focus:ring-offset-1 focus:ring-orange focus:ring-opacity-20 focus:ring-offset-orange focus:border-transparent text-gray border border-indigo-300 bg-indigo-200 rounded-md placeholder-gray-light" label="Новый пароль"
type="password"
/>
</div>
<div class="lg:col-span-2 2xl:col-span-1 2xl:mt-8">
<loading-button :loading="form.processing" class="transition shadow-none hover:shadow-classic2 inline-flex items-center px-3 py-2.5 w-full justify-center text-base rounded-md text-white bg-orange focus:outline-none"
type="submit"
>
Обновить
</loading-button>
</div>
</form>
<form class="mt-10 grid gap-4 lg:gap-10 grid-cols-1 lg:grid-cols-2" @submit.prevent="submit">
<div class="flex flex-col">
<text-input v-model="form.first_name" :error="form.errors.first_name"
class="focus:ring-4 focus:ring-offset-1 focus:ring-orange focus:ring-opacity-20 focus:ring-offset-orange focus:border-transparent text-gray border border-indigo-300 bg-indigo-200 rounded-md placeholder-gray-light" label="Имя"
/>
</div>
<div class="flex flex-col">
<text-input v-model="form.last_name" :error="form.errors.last_name"
class="focus:ring-4 focus:ring-offset-1 focus:ring-orange focus:ring-opacity-20 focus:ring-offset-orange focus:border-transparent text-gray border border-indigo-300 bg-indigo-200 rounded-md placeholder-gray-light" label="Фамилия"
/>
</div>
<div class="flex flex-col">
<text-input v-model="form.username" :error="form.errors.username"
class="focus:ring-4 focus:ring-offset-1 focus:ring-orange focus:ring-opacity-20 focus:ring-offset-orange focus:border-transparent text-gray border border-indigo-300 bg-indigo-200 rounded-md placeholder-gray-light" label="Тег"
/>
</div>
<div class="flex flex-col">
<text-input v-model="form.date_of_birth" :error="form.errors.date_of_birth"
type="date" class="focus:ring-4 focus:ring-offset-1 focus:ring-orange focus:ring-opacity-20 focus:ring-offset-orange focus:border-transparent text-gray border border-indigo-300 bg-indigo-200 rounded-md placeholder-gray-light"
label="Дата рождения"
/>
</div>
<div class="flex flex-col">
<text-input v-model="form.email" :error="form.errors.email"
type="email" class="focus:ring-4 focus:ring-offset-1 focus:ring-orange focus:ring-opacity-20 focus:ring-offset-orange focus:border-transparent text-gray border border-indigo-300 bg-indigo-200 rounded-md placeholder-gray-light"
label="Почта"
/>
</div>
<div class="flex flex-col">
<text-input v-model="form.phone" :error="form.errors.phone"
type="tel" class="focus:ring-4 focus:ring-offset-1 focus:ring-orange focus:ring-opacity-20 focus:ring-offset-orange focus:border-transparent text-gray border border-indigo-300 bg-indigo-200 rounded-md placeholder-gray-light"
label="Телефон"
/>
</div>
<div class="flex flex-col">
<text-input v-model="form.inn" :error="form.errors.inn"
class="focus:ring-4 focus:ring-offset-1 focus:ring-orange focus:ring-opacity-20 focus:ring-offset-orange focus:border-transparent text-gray border border-indigo-300 bg-indigo-200 rounded-md placeholder-gray-light"
label="ИНН"
/>
</div>
<div class="flex flex-col">
<text-input v-model="form.checking_account" :error="form.errors.checking_account"
class="focus:ring-4 focus:ring-offset-1 focus:ring-orange focus:ring-opacity-20 focus:ring-offset-orange focus:border-transparent text-gray border border-indigo-300 bg-indigo-200 rounded-md placeholder-gray-light"
label="Расчетный счет"
/>
</div>
<div class="flex flex-col">
<text-input v-model="form.bik" :error="form.errors.bik"
class="focus:ring-4 focus:ring-offset-1 focus:ring-orange focus:ring-opacity-20 focus:ring-offset-orange focus:border-transparent text-gray border border-indigo-300 bg-indigo-200 rounded-md placeholder-gray-light"
label="Бик банка"
/>
</div>
<div>
<div class="text-gray-light text-lg mb-2">
Пол
</div>
<div class="flex space-x-6">
<div class="flex items-center">
<input id="user-sex-1" v-model="form.sex"
value="1" type="radio"
class="h-5 w-5 text-orange border-gray-light focus:ring-transparent focus:ring-offset-transparent"
>
<label for="user-sex-1" class="select-none ml-3 text-gray">Женский</label>
</div>
<div class="flex items-center">
<input id="user-sex-2" v-model="form.sex"
value="2" type="radio"
class="h-5 w-5 text-orange border-gray-light focus:ring-transparent focus:ring-offset-transparent"
>
<label for="user-sex-2" class="select-none ml-3 text-gray">Мужской</label>
</div>
</div>
</div>
<div class="lg:col-span-2">
<div class="text-gray-light text-lg mb-2">
Тип
</div>
<div class="flex space-x-6">
<div class="flex items-center">
<input id="user-type-1" v-model="form.type"
value="1" type="radio"
class="h-5 w-5 text-orange border-gray-light focus:ring-transparent focus:ring-offset-transparent"
>
<label for="user-type-1" class="select-none ml-3 text-gray">Физ. лицо</label>
</div>
<div class="flex items-center">
<input id="user-type-2" v-model="form.type"
value="2" type="radio"
class="h-5 w-5 text-orange border-gray-light focus:ring-transparent focus:ring-offset-transparent"
>
<label for="user-type-2" class="select-none ml-3 text-gray">Самозанятый</label>
</div>
<div class="flex items-center">
<input id="user-type-3" v-model="form.type"
value="3" type="radio"
class="h-5 w-5 text-orange border-gray-light focus:ring-transparent focus:ring-offset-transparent"
>
<label for="user-type-3" class="select-none ml-3 text-gray">Юридическое лицо</label>
</div>
<div class="flex items-center">
<input id="user-type-4" v-model="form.type"
value="4" type="radio"
class="h-5 w-5 text-orange border-gray-light focus:ring-transparent focus:ring-offset-transparent"
>
<label for="user-type-4" class="select-none ml-3 text-gray">ИП</label>
</div>
</div>
</div>
<div class="lg:col-span-2">
<div class="flex flex-col">
<textarea-input v-model="form.about" label="О себе"
:error="form.errors.about" class="focus:ring-4 focus:ring-offset-1 focus:ring-orange focus:ring-opacity-20 focus:ring-offset-orange focus:border-transparent text-gray border border-indigo-300 bg-indigo-200 rounded-md"
cols="30" rows="2"
></textarea-input>
</div>
</div>
<div class="lg:col-span-2">
<!-- <div class="text-gray-light text-lg mb-2">
Ограничить доступ
</div> -->
<div class="flex items-center">
<input id="user-private" v-model="form.private"
type="checkbox" class="h-5 w-5 text-orange border-gray-light focus:ring-transparent focus:ring-offset-transparent"
>
<label for="user-private" class="select-none ml-3 text-gray">Включить эксклюзивный акаунт, доступ к контенту только по подписке</label>
</div>
<!-- <div class="flex items-center">
<input id="user-commercial" v-model="form.allow_adult_content"
type="checkbox" class="h-5 w-5 text-orange border-gray-light focus:ring-transparent focus:ring-offset-transparent"
>
<label for="user-commercial" class="select-none ml-3 text-gray">Разрешить контент для взрослых</label>
</div> -->
</div>
<div class="flex flex-wrap -my-1 -mx-3">
<loading-button :loading="form.processing" 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"
type="submit"
>
Сохранить
</loading-button>
<!-- <button type="button"
class="mx-3 my-1 default text-lg text-orange"
>
Удалить аккаунт
</button> -->
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { useForm } from '@inertiajs/inertia-vue3'
import { Inertia } from '@inertiajs/inertia'
import { toRefs } from 'vue'
import Layout from '@/Shared/Layout.vue'
import SettingsMenu from '@/Shared/LayoutParts/SettingsMenu.vue'
import LoadingButton from '@/Shared/Form/LoadingButton.vue'
import UserAvatar from '@/Shared/Misc/UserAvatar.vue'
import UserBanner from '@/Shared/Misc/UserBanner.vue'
import MetaHead from '@/Shared/MetaHead.vue'
import TextInput from '@/Shared/Form/TextInput.vue'
import TextareaInput from '@/Shared/Form/TextareaInput.vue'
export default {
components: {
MetaHead,
UserAvatar,
UserBanner,
TextInput,
TextareaInput,
LoadingButton,
SettingsMenu,
},
layout: Layout,
props: {
user: Object,
},
setup(props) {
const { user } = toRefs(props)
const form = useForm({
first_name: user.value.first_name,
last_name: user.value.last_name,
username: user.value.username,
email: user.value.email,
phone: user.value.phone,
sex: user.value.sex,
type: user.value.type,
date_of_birth: user.value.date_of_birth,
about: user.value.about,
private: user.value.private,
inn: user.value.inn,
checking_account: user.value.checking_account,
bik: user.value.bik,
password: null,
})
const passwordForm = useForm({
old_password: null,
new_password: null,
})
const submit = () => {
form.put(route('users.update', user.value.id))
}
const submitPassword = () => {
passwordForm.put(route('users.update.password', user.value.id), {
onSuccess: () => passwordForm.reset(),
})
}
return { form, passwordForm, submit, submitPassword }
},
methods: {
previewFilesBanner(event){
const file = event.target.files[0]
Inertia.post(route('image.banner'), {
_method: 'put',
banner: file,
})
},
previewFiles(event){
const file = event.target.files[0]
Inertia.post(route('image.avatar'), {
_method: 'put',
avatar: file,
})
},
changeBanner(){
this.$refs.filebanner.click()
},
removeBanner(){
Inertia.post(route('image.banner.remove'), {
_method: 'delete',
})
},
changeAvatar(){
this.$refs.fileavatar.click()
},
removeAvatar(){
Inertia.post(route('image.avatar.remove'), {
_method: 'delete',
})
}
},
}
</script>