Skip to content

Commit

Permalink
Recurring-invoice page schedule align problem solved
Browse files Browse the repository at this point in the history
  • Loading branch information
@mervekaraman
mervekaraman committed Aug 29, 2023
1 parent a7b8f2f commit 295d81f
Showing 1 changed file with 23 additions and 25 deletions.
48 changes: 23 additions & 25 deletions resources/assets/js/components/AkauntingRecurring.vue
View file
@@ -1,7 +1,7 @@
<template>
<div class="sm:col-span-6 space-y-6 sm:space-y-2">
<div class="flex flex-wrap lg:flex-nowrap items-center space-y-1 lg:space-y-0" :class="{ 'justify-start': frequency == 'custom' }">
<div class="w-24 sm:w-60 px-0 sm:px-2 text-sm">
<div class="flex flex-wrap lg:flex-nowrap items-start space-y-1 lg:space-y-0" :class="{ 'justify-start': frequency == 'custom' }">
<div class="w-24 sm:w-60 px-0 sm:px-2 text-sm pt-4">
{{ frequencyText }}
</div>

Expand All @@ -14,15 +14,16 @@
</el-option>
</el-select>

<div class="w-20 sm:w-auto px-2 text-sm text-center" v-if="frequency == 'custom'">
<div class="w-24 px-2 text-sm text-center pt-4" v-if="frequency == 'custom'">
{{ frequencyEveryText }}
</div>

<input type="text" class="w-20 text-sm px-3 py-2.5 mt-1 rounded-lg border border-light-gray text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" v-model="interval" @input="change" v-if="frequency == 'custom'">

<div class="text-red text-sm mt-1 block" v-if="invertalError" v-html="invertalError"></div>
<div class="flex flex-col">
<input type="text" class="w-20 text-sm px-3 py-2.5 mt-1 rounded-lg border border-light-gray text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" v-model="interval" @input="change" v-if="frequency == 'custom'">
<div class="text-red text-sm mt-1 block w-36" v-if="invertalError" v-html="invertalError"></div>
</div>

<el-select class="w-36 ml-2" v-model="customFrequency" @input="change" v-if="frequency == 'custom'">
<el-select class="w-36" v-model="customFrequency" @input="change" v-if="frequency == 'custom'" v-bind:class="invertalError ? '-ml-14' : 'ml-2' ">
<el-option
v-for="(label, value) in customFrequencies"
:key="value"
Expand All @@ -31,16 +32,15 @@
</el-option>
</el-select>

<div class="text-red text-sm mt-1 block" v-if="customFrequencyError" v-html="customFrequencyError"></div>
<div class="text-red text-sm mt-1 block w-36" v-if="customFrequencyError" v-html="customFrequencyError"></div>
</div>

<div class="flex flex-wrap lg:flex-nowrap items-center space-y-3 lg:space-y-0" :class="{ 'justify-start': limit !== 'never' }">
<div class="w-24 sm:w-60 px-0 sm:px-2 text-sm">
<div class="flex flex-wrap lg:flex-nowrap items-start space-y-3 lg:space-y-0 pt-4" :class="{ 'justify-start': limit !== 'never' }">
<div class="w-24 sm:w-60 px-0 sm:px-2 text-sm pt-4">
{{ startText }}
</div>

<div
:class="startedError ? 'pt-0' : '' && startedError || limitDateError ? 'pt-0 pb-5' : 'pb-10' && startedError && limitDateError ? 'pt-6 pb-5' : 'pb-10'">
<div>
<el-date-picker
class="w-36 cursor-pointer recurring-invoice-data"
v-model="started_at"
Expand Down Expand Up @@ -82,17 +82,15 @@
}">
</el-date-picker>

<div class="text-red text-sm mt-1 block" v-if="startedError" v-html="startedError"></div>
<div class="text-red text-sm mt-1 block w-36" v-if="startedError" v-html="startedError"></div>

</div>

<div class="w-24 px-2 text-sm text-center"
:class="(startedError || limitDateError ? 'pt-10 pb-14' : 'pb-10') && (startedError && limitDateError ? 'pt-6 pb-14' : 'pb-10')">
<div class="w-24 px-2 text-sm text-center pt-4">
{{ middleText }}
</div>

<el-select class="w-20" v-model="limit" @input="change"
:class="startedError || limitDateError ? 'pt-0 pb-6' : '' && startedError && limitDateError ? 'pt-6 pb-16' : 'pb-10'">
<el-select class="w-20" v-model="limit" @input="change">
<el-option
v-for="(label, value) in limits"
:key="value"
Expand All @@ -101,16 +99,16 @@
</el-option>
</el-select>

<input type="text" class="w-20 cursor-pointer text-sm px-3 py-2.5 mt-1 ml-2 rounded-lg border border-light-gray text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" v-model="limitCount" v-if="limit == 'after'" @input="change">

<div class="text-red text-sm mt-1 block" v-if="limitCountError" v-html="limitCountError"></div>
<div class="flex flex-col">
<input type="text" class="w-20 cursor-pointer text-sm px-3 py-2.5 mt-1 ml-2 rounded-lg border border-light-gray text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" v-model="limitCount" v-if="limit == 'after'" @input="change">
<div class="text-red text-sm mt-1 ml-2 block w-36" v-show="limitCountError" v-html="limitCountError"></div>
</div>

<div class="pl-2 text-sm" v-if="limit == 'after'">
<div class="pl-2 pt-4 text-sm" v-if="limit == 'after'" v-bind:class="limitCountError ? '-ml-16' : ''">
{{ endText }}
</div>

<div
:class="startedError || limitDateError ? 'pt-10 pb-10' : 'pb-10' && startedError && limitDateError ? ' pt-20 pb-14' : 'pb-10'">
<div class="flex flex-col">
<el-date-picker
class="w-36 ml-2 cursor-pointer recurring-invoice-data"
v-model="limitDate"
Expand All @@ -123,11 +121,11 @@
>
</el-date-picker>

<div class="text-red text-sm mt-1 ml-2 block" v-if="limitDateError" v-html="limitDateError"></div>
<div class="text-red text-sm mt-1 ml-2 block w-36" v-if="limitDateError" v-html="limitDateError"></div>
</div>
</div>

<div v-if="sendEmailShow" class="flex flex-wrap lg:flex-nowrap items-center space-y-1 lg:space-y-0">
<div v-if="sendEmailShow" class="flex flex-wrap lg:flex-nowrap items-center space-y-1 lg:space-y-0 pt-6">
<div class="w-24 sm:w-60 px-0 sm:px-2 text-sm">
{{ sendEmailText }}
</div>
Expand Down

0 comments on commit 295d81f

Please sign in to comment.