Recurring-invoice page schedule align problem solved
This commit is contained in:
parent
a7b8f2fc38
commit
295d81f89c
@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="sm:col-span-6 space-y-6 sm:space-y-2">
|
<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="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">
|
<div class="w-24 sm:w-60 px-0 sm:px-2 text-sm pt-4">
|
||||||
{{ frequencyText }}
|
{{ frequencyText }}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -14,15 +14,16 @@
|
|||||||
</el-option>
|
</el-option>
|
||||||
</el-select>
|
</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 }}
|
{{ frequencyEveryText }}
|
||||||
</div>
|
</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'">
|
<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>
|
||||||
|
|
||||||
<div class="text-red text-sm mt-1 block" v-if="invertalError" v-html="invertalError"></div>
|
<el-select class="w-36" v-model="customFrequency" @input="change" v-if="frequency == 'custom'" v-bind:class="invertalError ? '-ml-14' : 'ml-2' ">
|
||||||
|
|
||||||
<el-select class="w-36 ml-2" v-model="customFrequency" @input="change" v-if="frequency == 'custom'">
|
|
||||||
<el-option
|
<el-option
|
||||||
v-for="(label, value) in customFrequencies"
|
v-for="(label, value) in customFrequencies"
|
||||||
:key="value"
|
:key="value"
|
||||||
@ -31,16 +32,15 @@
|
|||||||
</el-option>
|
</el-option>
|
||||||
</el-select>
|
</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>
|
||||||
|
|
||||||
<div class="flex flex-wrap lg:flex-nowrap items-center space-y-3 lg:space-y-0" :class="{ 'justify-start': limit !== 'never' }">
|
<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">
|
<div class="w-24 sm:w-60 px-0 sm:px-2 text-sm pt-4">
|
||||||
{{ startText }}
|
{{ startText }}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div
|
<div>
|
||||||
:class="startedError ? 'pt-0' : '' && startedError || limitDateError ? 'pt-0 pb-5' : 'pb-10' && startedError && limitDateError ? 'pt-6 pb-5' : 'pb-10'">
|
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
class="w-36 cursor-pointer recurring-invoice-data"
|
class="w-36 cursor-pointer recurring-invoice-data"
|
||||||
v-model="started_at"
|
v-model="started_at"
|
||||||
@ -82,17 +82,15 @@
|
|||||||
}">
|
}">
|
||||||
</el-date-picker>
|
</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>
|
||||||
|
|
||||||
<div class="w-24 px-2 text-sm text-center"
|
<div class="w-24 px-2 text-sm text-center pt-4">
|
||||||
:class="(startedError || limitDateError ? 'pt-10 pb-14' : 'pb-10') && (startedError && limitDateError ? 'pt-6 pb-14' : 'pb-10')">
|
|
||||||
{{ middleText }}
|
{{ middleText }}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<el-select class="w-20" v-model="limit" @input="change"
|
<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-option
|
<el-option
|
||||||
v-for="(label, value) in limits"
|
v-for="(label, value) in limits"
|
||||||
:key="value"
|
:key="value"
|
||||||
@ -101,16 +99,16 @@
|
|||||||
</el-option>
|
</el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
|
|
||||||
|
<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">
|
<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="text-red text-sm mt-1 block" v-if="limitCountError" v-html="limitCountError"></div>
|
<div class="pl-2 pt-4 text-sm" v-if="limit == 'after'" v-bind:class="limitCountError ? '-ml-16' : ''">
|
||||||
|
|
||||||
<div class="pl-2 text-sm" v-if="limit == 'after'">
|
|
||||||
{{ endText }}
|
{{ endText }}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div
|
<div class="flex flex-col">
|
||||||
:class="startedError || limitDateError ? 'pt-10 pb-10' : 'pb-10' && startedError && limitDateError ? ' pt-20 pb-14' : 'pb-10'">
|
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
class="w-36 ml-2 cursor-pointer recurring-invoice-data"
|
class="w-36 ml-2 cursor-pointer recurring-invoice-data"
|
||||||
v-model="limitDate"
|
v-model="limitDate"
|
||||||
@ -123,11 +121,11 @@
|
|||||||
>
|
>
|
||||||
</el-date-picker>
|
</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>
|
</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">
|
<div class="w-24 sm:w-60 px-0 sm:px-2 text-sm">
|
||||||
{{ sendEmailText }}
|
{{ sendEmailText }}
|
||||||
</div>
|
</div>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user