create coupon section
This commit is contained in:
HAM!DREZA
+124
-112
@@ -1,123 +1,135 @@
|
||||
<template>
|
||||
<section class="flex flex-col gap-4">
|
||||
<Panel :header="$t('ویرایش تخفیف')">
|
||||
<div class="grid grid-cols-3 gap-7">
|
||||
<div class="flex flex-col gap-1">
|
||||
<FloatLabel>
|
||||
<InputText class="w-full custom-input" v-model="date" />
|
||||
<label>{{ $t("تاریخ شروع") }}</label>
|
||||
</FloatLabel>
|
||||
<date-picker
|
||||
type="datetime"
|
||||
format="YYYY-MM-DD HH:mm"
|
||||
display-format="jYYYY-jMM-jDD HH:mm"
|
||||
:timezone="true"
|
||||
color="dimgray"
|
||||
v-model="date"
|
||||
simple
|
||||
custom-input=".custom-input"
|
||||
></date-picker>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-1">
|
||||
<FloatLabel>
|
||||
<InputText class="w-full custom-input2" v-model="date2" />
|
||||
<label>{{ $t("تاریخ پایان") }}</label>
|
||||
</FloatLabel>
|
||||
<date-picker
|
||||
type="datetime"
|
||||
format="YYYY-MM-DD HH:mm"
|
||||
display-format="jYYYY-jMM-jDD HH:mm"
|
||||
:timezone="true"
|
||||
color="dimgray"
|
||||
v-model="date2"
|
||||
simple
|
||||
custom-input=".custom-input2"
|
||||
></date-picker>
|
||||
</div>
|
||||
<div class="flex flex-col gap-1">
|
||||
<FloatLabel>
|
||||
<InputText class="w-full" v-model="course.duration" />
|
||||
<label>{{ $t("کد تخفیف") }}</label>
|
||||
</FloatLabel>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-1">
|
||||
<FloatLabel>
|
||||
<Dropdown
|
||||
v-model="noe"
|
||||
:options="['مبلغ', 'درصد']"
|
||||
:optionLabel="levels"
|
||||
:optionValue="levels"
|
||||
class="w-full"
|
||||
/>
|
||||
<label>{{ $t("نوع تخفیف") }}</label>
|
||||
</FloatLabel>
|
||||
</div>
|
||||
<div v-if="noe === 'مبلغ'" class="flex flex-col gap-1">
|
||||
<FloatLabel>
|
||||
<InputText class="w-full" />
|
||||
<label>{{ $t("مبلغ تخفیف") }}</label>
|
||||
</FloatLabel>
|
||||
</div>
|
||||
|
||||
<div v-if="noe === 'درصد'" class="flex flex-col gap-1">
|
||||
<FloatLabel>
|
||||
<InputText class="w-full" />
|
||||
<label>{{ $t("درصد تخفیف") }}</label>
|
||||
</FloatLabel>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-1 my-custom-container inline">
|
||||
<FloatLabel>
|
||||
<InputText class="w-full" />
|
||||
<label>{{ $t("تخفیف برای همه کاربران") }}</label>
|
||||
</FloatLabel>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex pt-4 justify-end">
|
||||
<Button
|
||||
:label="$t('save')"
|
||||
icon="pi pi-save"
|
||||
severity="success"
|
||||
:loading="saving"
|
||||
@click="create(course)"
|
||||
<section class="flex flex-col gap-4">
|
||||
<Panel :header="$t('ویرایش تخفیف')">
|
||||
<div class="grid grid-cols-3 gap-7">
|
||||
<div class="flex flex-col gap-1">
|
||||
<FloatLabel>
|
||||
<InputText class="w-full custom-input" v-model="date" />
|
||||
<label>{{ $t("تاریخ شروع") }}</label>
|
||||
</FloatLabel>
|
||||
<date-picker
|
||||
type="datetime"
|
||||
format="YYYY-MM-DD HH:mm"
|
||||
display-format="jYYYY-jMM-jDD HH:mm"
|
||||
:timezone="true"
|
||||
color="dimgray"
|
||||
v-model="date"
|
||||
simple
|
||||
custom-input=".custom-input"
|
||||
></date-picker>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-1">
|
||||
<FloatLabel>
|
||||
<InputText class="w-full custom-input2" v-model="date2" />
|
||||
<label>{{ $t("تاریخ پایان") }}</label>
|
||||
</FloatLabel>
|
||||
<date-picker
|
||||
type="datetime"
|
||||
format="YYYY-MM-DD HH:mm"
|
||||
display-format="jYYYY-jMM-jDD HH:mm"
|
||||
:timezone="true"
|
||||
color="dimgray"
|
||||
v-model="date2"
|
||||
simple
|
||||
custom-input=".custom-input2"
|
||||
></date-picker>
|
||||
</div>
|
||||
<div class="flex flex-col gap-1">
|
||||
<FloatLabel>
|
||||
<InputText class="w-full" v-model="discount.code" />
|
||||
<label>{{ $t("کد تخفیف") }}</label>
|
||||
</FloatLabel>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-1">
|
||||
<FloatLabel>
|
||||
<Dropdown
|
||||
v-model="noe"
|
||||
@change="setType"
|
||||
:options="['مبلغ', 'درصد']"
|
||||
:optionLabel="levels"
|
||||
:optionValue="levels"
|
||||
class="w-full"
|
||||
/>
|
||||
</div>
|
||||
</Panel>
|
||||
</section>
|
||||
<label>{{ $t("نوع تخفیف") }}</label>
|
||||
</FloatLabel>
|
||||
</div>
|
||||
<div v-if="noe === 'مبلغ'" class="flex flex-col gap-1">
|
||||
<FloatLabel>
|
||||
<InputText class="w-full" v-model="discount.price" />
|
||||
<label>{{ $t("مبلغ تخفیف") }}</label>
|
||||
</FloatLabel>
|
||||
</div>
|
||||
|
||||
<div v-if="noe === 'درصد'" class="flex flex-col gap-1">
|
||||
<FloatLabel>
|
||||
<InputText class="w-full" v-model="discount.percent" />
|
||||
<label>{{ $t("درصد تخفیف") }}</label>
|
||||
</FloatLabel>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex pt-4 justify-end">
|
||||
<Button
|
||||
:label="$t('save')"
|
||||
icon="pi pi-save"
|
||||
severity="success"
|
||||
:loading="saving"
|
||||
@click="create(discount)"
|
||||
/>
|
||||
</div>
|
||||
</Panel>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { useDiscountStore } from "@/stores/discounts";
|
||||
import { ref, watchEffect, reactive } from "vue";
|
||||
import moment from 'moment-jalaali'
|
||||
import moment from "moment-jalaali";
|
||||
import { useRoute } from "vue-router";
|
||||
const date= ref(null)
|
||||
const date2= ref(null)
|
||||
const noe = ref('مبلغ')
|
||||
const date = ref(null);
|
||||
const date2 = ref(null);
|
||||
const noe = ref("مبلغ");
|
||||
const store = useDiscountStore();
|
||||
const data = ref(null);
|
||||
const course = reactive({
|
||||
name: "",
|
||||
description: "",
|
||||
slug: "",
|
||||
duration: "",
|
||||
image: "",
|
||||
categories: "",
|
||||
price: 0,
|
||||
teacher: "",
|
||||
completionPercentage: 0,
|
||||
level: "",
|
||||
language: "",
|
||||
countOfVideos: 0,
|
||||
totalFileSize: "",
|
||||
const data = ref();
|
||||
const setType = (val) => {
|
||||
if (val.value === 'درصد') {
|
||||
discount.discountType = 'percent'
|
||||
}else{
|
||||
discount.discountType = 'price'
|
||||
}
|
||||
}
|
||||
const discount = reactive({
|
||||
id: "",
|
||||
startDate: "",
|
||||
endDate: "",
|
||||
code: "",
|
||||
discountType: "",
|
||||
price: "",
|
||||
percent: 0,
|
||||
allUsers: true,
|
||||
});
|
||||
const route = useRoute();
|
||||
const create = async(val) => {
|
||||
const posts = await store.update(val)
|
||||
};
|
||||
watchEffect(async () => {
|
||||
data.value = await store.getDiscount(route.params.id);
|
||||
console.log("this", data.value);
|
||||
discount.id = data.value.id;
|
||||
(discount.startDate = data.value.startDate),
|
||||
(discount.endDate = data.value.endDate),
|
||||
(discount.code = data.value.code),
|
||||
(discount.discountType = data.value.discountType),
|
||||
(discount.price = data.value.price),
|
||||
(discount.percent = data.value.percent);
|
||||
date.value = data.value.startDate;
|
||||
date2.value = data.value.endDate;
|
||||
if (data.value.discountType === "percent") {
|
||||
noe.value = "درصد";
|
||||
} else {
|
||||
noe.value = "مبلغ";
|
||||
}
|
||||
});
|
||||
const route = useRoute()
|
||||
|
||||
watchEffect(async() =>{
|
||||
data.value = await store.getDiscount(route.params.id)
|
||||
})
|
||||
console.log('this', data);
|
||||
</script>
|
||||
Reference in New Issue
Block a user