parent
fbee04a56f
commit
b4541a9153
@ -1,152 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { ref, reactive, computed } from "vue";
|
|
||||||
|
|
||||||
import { addBonus } from "@/api/bonus";
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
show: {
|
|
||||||
type: Boolean,
|
|
||||||
default: false,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const emit = defineEmits(['update:show','reload']);
|
|
||||||
|
|
||||||
const showDrawer = computed({
|
|
||||||
get: () => props.show,
|
|
||||||
set: (value) => {
|
|
||||||
emit("update:show", value);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const formRef = ref();
|
|
||||||
|
|
||||||
const rules = reactive({
|
|
||||||
type_name: [{ required: true, message: "請輸入優惠劵名稱", trigger: "blur" }],
|
|
||||||
type_money: [{ required: true, message: "請輸入優惠劵金額", trigger: "blur" }],
|
|
||||||
send_type: [{ required: true, message: "請選擇發放方式", trigger: "change" }],
|
|
||||||
});
|
|
||||||
|
|
||||||
const form = reactive({
|
|
||||||
type_name: '',
|
|
||||||
type_money: 0,
|
|
||||||
send_type: 4,
|
|
||||||
min_amount: 0,
|
|
||||||
send_type: null,
|
|
||||||
user_bonus_max: 0,
|
|
||||||
});
|
|
||||||
|
|
||||||
const loading = ref(false);
|
|
||||||
|
|
||||||
const handleClose = () => {
|
|
||||||
showDrawer.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleSubmit = async (formEl) => {
|
|
||||||
if (!formEl) return;
|
|
||||||
|
|
||||||
await formEl.validate(async (valid, fields) => {
|
|
||||||
if (!valid) return;
|
|
||||||
|
|
||||||
let res = await addBonus(form)
|
|
||||||
if(res.code === 200){
|
|
||||||
// 關閉抽屜
|
|
||||||
showDrawer.value = false;
|
|
||||||
// 重置表單
|
|
||||||
formRef.value.resetFields();
|
|
||||||
|
|
||||||
// emit reload event
|
|
||||||
emit('reload');
|
|
||||||
|
|
||||||
// 顥示提示訊息
|
|
||||||
return ElMessage.success('新增成功');
|
|
||||||
}
|
|
||||||
// 顯示錯誤提示訊息
|
|
||||||
return ElMessage.error(res.msg);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<el-drawer v-model="showDrawer" size="50%" title="新增優惠劵">
|
|
||||||
<template #header>
|
|
||||||
<h4>新增優惠劵</h4>
|
|
||||||
</template>
|
|
||||||
<template #default>
|
|
||||||
<!-- <div v-loading="loading"> -->
|
|
||||||
<el-form
|
|
||||||
:model="form"
|
|
||||||
ref="formRef"
|
|
||||||
:rules="rules"
|
|
||||||
label-width="120px"
|
|
||||||
>
|
|
||||||
<el-form-item label="優惠劵名稱" prop="type_name">
|
|
||||||
<el-input v-model="form.type_name" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="優惠劵金額" prop="type_money">
|
|
||||||
<el-input v-model="form.type_money" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="最小訂單金額">
|
|
||||||
<el-input v-model="form.min_amount" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="發放方式" prop="send_type">
|
|
||||||
<el-radio-group v-model="form.send_type">
|
|
||||||
<!-- <el-radio :label="1">會員發放</el-radio> -->
|
|
||||||
<!-- <el-radio :label="2">商品發放</el-radio> -->
|
|
||||||
<!-- <el-radio :label="3">訂單方式</el-radio> -->
|
|
||||||
<el-radio :label="4">線下發放</el-radio>
|
|
||||||
<!-- <el-radio :label="5">線上發放</el-radio> -->
|
|
||||||
<!-- <el-radio :label="6">註冊發放</el-radio> -->
|
|
||||||
</el-radio-group>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="發放開始日">
|
|
||||||
<el-date-picker
|
|
||||||
v-model="form.send_start_date"
|
|
||||||
type="date"
|
|
||||||
format="YYYY-MM-DD"
|
|
||||||
value-format="YYYY-MM-DD"
|
|
||||||
placeholder="請選擇日期"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="發放結束日">
|
|
||||||
<el-date-picker
|
|
||||||
v-model="form.send_end_date"
|
|
||||||
type="date"
|
|
||||||
format="YYYY-MM-DD"
|
|
||||||
value-format="YYYY-MM-DD"
|
|
||||||
placeholder="請選擇日期"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="使用開始日" >
|
|
||||||
<el-date-picker
|
|
||||||
v-model="form.use_start_date"
|
|
||||||
type="date"
|
|
||||||
format="YYYY-MM-DD"
|
|
||||||
value-format="YYYY-MM-DD"
|
|
||||||
placeholder="請選擇日期"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="使用結束日" >
|
|
||||||
<el-date-picker
|
|
||||||
v-model="form.use_end_date"
|
|
||||||
type="date"
|
|
||||||
format="YYYY-MM-DD"
|
|
||||||
value-format="YYYY-MM-DD"
|
|
||||||
placeholder="請選擇日期"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
<!-- </div> -->
|
|
||||||
</template>
|
|
||||||
<template #footer>
|
|
||||||
<div style="flex: auto">
|
|
||||||
<el-button @click="handleClose">關閉</el-button>
|
|
||||||
<el-button type="primary" @click="handleSubmit(formRef)"
|
|
||||||
>送出</el-button
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-drawer>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style lang="less"></style>
|
|
||||||
@ -0,0 +1,200 @@
|
|||||||
|
<script setup>
|
||||||
|
import { ref, reactive, watch, computed } from "vue";
|
||||||
|
|
||||||
|
import { addBonus, getBonus, updateBonus } from "@/api/bonus";
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
show: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
edit_id: {
|
||||||
|
type: Number,
|
||||||
|
default: 0,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const emit = defineEmits(["update:show", "update:edit_id", "reload"]);
|
||||||
|
|
||||||
|
const showDrawer = computed({
|
||||||
|
get: () => props.show,
|
||||||
|
set: (value) => {
|
||||||
|
emit("update:show", value);
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const formRef = ref();
|
||||||
|
|
||||||
|
const rules = reactive({
|
||||||
|
type_name: [{ required: true, message: "請輸入優惠劵名稱", trigger: "blur" }],
|
||||||
|
type_money: [
|
||||||
|
{ required: true, message: "請輸入優惠劵金額", trigger: "blur" },
|
||||||
|
],
|
||||||
|
send_type: [{ required: true, message: "請選擇發放方式", trigger: "change" }],
|
||||||
|
});
|
||||||
|
|
||||||
|
const form = ref({
|
||||||
|
act: "insert",
|
||||||
|
type_id: 0,
|
||||||
|
type_name: "",
|
||||||
|
type_money: 0,
|
||||||
|
send_type: 4,
|
||||||
|
min_amount: 0,
|
||||||
|
user_bonus_max: 0,
|
||||||
|
});
|
||||||
|
|
||||||
|
const loading = ref(false);
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => props.edit_id,
|
||||||
|
async (newVal) => {
|
||||||
|
console.log(newVal);
|
||||||
|
if (newVal > 0) {
|
||||||
|
let res = await getBonus(newVal);
|
||||||
|
if (res.code === 200) {
|
||||||
|
form.value = res.data;
|
||||||
|
form.value.act = "update";
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
form.value = {
|
||||||
|
act: "insert",
|
||||||
|
type_id: 0,
|
||||||
|
type_name: "",
|
||||||
|
type_money: 0,
|
||||||
|
send_type: 4,
|
||||||
|
min_amount: 0,
|
||||||
|
user_bonus_max: 0,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
const handleClose = () => {
|
||||||
|
emit("update:edit_id", 0);
|
||||||
|
showDrawer.value = false;
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleSubmit = async (formEl) => {
|
||||||
|
if (!formEl) return;
|
||||||
|
|
||||||
|
await formEl.validate(async (valid, fields) => {
|
||||||
|
if (!valid) return;
|
||||||
|
|
||||||
|
let res;
|
||||||
|
if (form.value.act === "update") {
|
||||||
|
res = await updateBonus(form.value);
|
||||||
|
} else {
|
||||||
|
res = await addBonus(form.value);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (res.code === 200) {
|
||||||
|
// 關閉抽屜
|
||||||
|
showDrawer.value = false;
|
||||||
|
// 重置表單
|
||||||
|
formRef.value.resetFields();
|
||||||
|
|
||||||
|
// emit reload event
|
||||||
|
emit("reload");
|
||||||
|
|
||||||
|
// 顥示提示訊息
|
||||||
|
return ElMessage.success("操作成功");
|
||||||
|
}
|
||||||
|
// 顯示錯誤提示訊息
|
||||||
|
return ElMessage.error(res.msg);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<el-drawer
|
||||||
|
v-model="showDrawer"
|
||||||
|
size="50%"
|
||||||
|
title="新增優惠劵"
|
||||||
|
@close="handleClose"
|
||||||
|
>
|
||||||
|
<template #header>
|
||||||
|
<h4>新增優惠劵</h4>
|
||||||
|
</template>
|
||||||
|
<template #default>
|
||||||
|
<!-- <div v-loading="loading"> -->
|
||||||
|
<el-form :model="form" ref="formRef" :rules="rules" label-width="120px">
|
||||||
|
<el-form-item label="優惠劵名稱" prop="type_name">
|
||||||
|
<el-input v-model="form.type_name" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="優惠劵金額" prop="type_money">
|
||||||
|
<el-input v-model="form.type_money" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="最小訂單金額">
|
||||||
|
<el-input v-model="form.min_amount" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="發放方式" prop="send_type">
|
||||||
|
<el-radio-group v-model="form.send_type">
|
||||||
|
<!-- <el-radio :label="1">會員發放</el-radio> -->
|
||||||
|
<!-- <el-radio :label="2">商品發放</el-radio> -->
|
||||||
|
<!-- <el-radio :label="3">訂單方式</el-radio> -->
|
||||||
|
<el-radio :label="4">線下發放</el-radio>
|
||||||
|
<!-- <el-radio :label="5">線上發放</el-radio> -->
|
||||||
|
<!-- <el-radio :label="6">註冊發放</el-radio> -->
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="發放開始日" v-show="form.send_type != 4">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="form.send_start_date"
|
||||||
|
type="date"
|
||||||
|
format="YYYY-MM-DD"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
placeholder="請選擇日期"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="發放結束日" v-show="form.send_type != 4">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="form.send_end_date"
|
||||||
|
type="date"
|
||||||
|
format="YYYY-MM-DD"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
placeholder="請選擇日期"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-space fill>
|
||||||
|
<el-alert type="info" show-icon :closable="true">
|
||||||
|
<p>空白為立即可以使用</p>
|
||||||
|
</el-alert>
|
||||||
|
<el-form-item label="使用開始日">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="form.use_start_date"
|
||||||
|
type="date"
|
||||||
|
format="YYYY-MM-DD"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
placeholder="請選擇日期"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-space>
|
||||||
|
<el-space fill>
|
||||||
|
<el-alert type="info" show-icon :closable="true">
|
||||||
|
<p>空白為永久可以使用</p>
|
||||||
|
</el-alert>
|
||||||
|
<el-form-item label="使用結束日">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="form.use_end_date"
|
||||||
|
type="date"
|
||||||
|
format="YYYY-MM-DD"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
placeholder="請選擇日期"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-space>
|
||||||
|
</el-form>
|
||||||
|
<!-- </div> -->
|
||||||
|
</template>
|
||||||
|
<template #footer>
|
||||||
|
<div style="flex: auto">
|
||||||
|
<el-button @click="handleClose">關閉</el-button>
|
||||||
|
<el-button type="primary" @click="handleSubmit(formRef)"
|
||||||
|
>送出</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-drawer>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="less"></style>
|
||||||
@ -1,151 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { ref, reactive, computed } from "vue";
|
|
||||||
|
|
||||||
import { addBonus } from "@/api/bonus";
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
show: {
|
|
||||||
type: Boolean,
|
|
||||||
default: false,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const emit = defineEmits(['update:show','reload']);
|
|
||||||
|
|
||||||
const showDrawer = computed({
|
|
||||||
get: () => props.show,
|
|
||||||
set: (value) => {
|
|
||||||
emit("update:show", value);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const formRef = ref();
|
|
||||||
|
|
||||||
const rules = reactive({
|
|
||||||
type_name: [{ required: true, message: "請輸入優惠劵名稱", trigger: "blur" }],
|
|
||||||
type_money: [{ required: true, message: "請輸入優惠劵金額", trigger: "blur" }],
|
|
||||||
send_type: [{ required: true, message: "請選擇發放方式", trigger: "change" }],
|
|
||||||
});
|
|
||||||
|
|
||||||
const form = reactive({
|
|
||||||
type_name: '',
|
|
||||||
type_money: 0,
|
|
||||||
min_amount: 0,
|
|
||||||
send_type: null,
|
|
||||||
user_bonus_max: 0,
|
|
||||||
});
|
|
||||||
|
|
||||||
const loading = ref(false);
|
|
||||||
|
|
||||||
const handleClose = () => {
|
|
||||||
showDrawer.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleSubmit = async (formEl) => {
|
|
||||||
if (!formEl) return;
|
|
||||||
|
|
||||||
await formEl.validate(async (valid, fields) => {
|
|
||||||
if (!valid) return;
|
|
||||||
|
|
||||||
let res = await addBonus(form)
|
|
||||||
if(res.code === 200){
|
|
||||||
// 關閉抽屜
|
|
||||||
showDrawer.value = false;
|
|
||||||
// 重置表單
|
|
||||||
formRef.value.resetFields();
|
|
||||||
|
|
||||||
// emit reload event
|
|
||||||
emit('reload');
|
|
||||||
|
|
||||||
// 顥示提示訊息
|
|
||||||
return ElMessage.success('新增成功');
|
|
||||||
}
|
|
||||||
// 顯示錯誤提示訊息
|
|
||||||
return ElMessage.error(res.msg);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<el-drawer v-model="showDrawer" size="50%" title="新增優惠劵">
|
|
||||||
<template #header>
|
|
||||||
<h4>新增優惠劵</h4>
|
|
||||||
</template>
|
|
||||||
<template #default>
|
|
||||||
<!-- <div v-loading="loading"> -->
|
|
||||||
<el-form
|
|
||||||
:model="form"
|
|
||||||
ref="formRef"
|
|
||||||
:rules="rules"
|
|
||||||
label-width="120px"
|
|
||||||
>
|
|
||||||
<el-form-item label="優惠劵名稱" prop="type_name">
|
|
||||||
<el-input v-model="form.type_name" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="優惠劵金額" prop="type_money">
|
|
||||||
<el-input v-model="form.type_money" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="最小訂單金額">
|
|
||||||
<el-input v-model="form.min_amount" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="發放方式" prop="send_type">
|
|
||||||
<el-radio-group v-model="form.send_type">
|
|
||||||
<!-- <el-radio :label="1">會員發放</el-radio> -->
|
|
||||||
<!-- <el-radio :label="2">商品發放</el-radio> -->
|
|
||||||
<!-- <el-radio :label="3">訂單方式</el-radio> -->
|
|
||||||
<el-radio :label="4">線下發放</el-radio>
|
|
||||||
<!-- <el-radio :label="5">線上發放</el-radio> -->
|
|
||||||
<!-- <el-radio :label="6">註冊發放</el-radio> -->
|
|
||||||
</el-radio-group>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="發放開始日">
|
|
||||||
<el-date-picker
|
|
||||||
v-model="form.send_start_date"
|
|
||||||
type="date"
|
|
||||||
format="YYYY-MM-DD"
|
|
||||||
value-format="YYYY-MM-DD"
|
|
||||||
placeholder="請選擇日期"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="發放結束日">
|
|
||||||
<el-date-picker
|
|
||||||
v-model="form.send_end_date"
|
|
||||||
type="date"
|
|
||||||
format="YYYY-MM-DD"
|
|
||||||
value-format="YYYY-MM-DD"
|
|
||||||
placeholder="請選擇日期"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="使用開始日" >
|
|
||||||
<el-date-picker
|
|
||||||
v-model="form.use_start_date"
|
|
||||||
type="date"
|
|
||||||
format="YYYY-MM-DD"
|
|
||||||
value-format="YYYY-MM-DD"
|
|
||||||
placeholder="請選擇日期"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="使用結束日" >
|
|
||||||
<el-date-picker
|
|
||||||
v-model="form.use_end_date"
|
|
||||||
type="date"
|
|
||||||
format="YYYY-MM-DD"
|
|
||||||
value-format="YYYY-MM-DD"
|
|
||||||
placeholder="請選擇日期"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
<!-- </div> -->
|
|
||||||
</template>
|
|
||||||
<template #footer>
|
|
||||||
<div style="flex: auto">
|
|
||||||
<el-button @click="handleClose">關閉</el-button>
|
|
||||||
<el-button type="primary" @click="handleSubmit(formRef)"
|
|
||||||
>送出</el-button
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-drawer>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style lang="less"></style>
|
|
||||||
Loading…
Reference in new issue