parent
71e9e99ff4
commit
0f82d48ef8
@ -1,10 +1,178 @@
|
|||||||
<scipt setup>
|
<script setup>
|
||||||
import { ref, reactive, watch, onMounted } from "vue";
|
import { onMounted, ref } from 'vue'
|
||||||
</scipt>
|
import { Delete } from "@element-plus/icons-vue";
|
||||||
|
|
||||||
|
import { getAffiliateConfig, setAffiliateConfig } from "@/api/affiliate";
|
||||||
|
|
||||||
|
const defaultForm = {
|
||||||
|
on: "1",
|
||||||
|
config: {
|
||||||
|
separator_type: "1",
|
||||||
|
expire: "24",
|
||||||
|
expire_unit: "hour",
|
||||||
|
level_money_all: "0",
|
||||||
|
level_point_all: "0",
|
||||||
|
level_register_all: "0",
|
||||||
|
level_register_up: "0",
|
||||||
|
},
|
||||||
|
item: []
|
||||||
|
}
|
||||||
|
|
||||||
|
const form = ref(defaultForm)
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
let res = await getAffiliateConfig()
|
||||||
|
if(res.code === 200) {
|
||||||
|
// form.value = res.data
|
||||||
|
}else{
|
||||||
|
ElMessage.error('讀取推薦設定失敗')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
const handleAddLevel = () => {
|
||||||
|
form.value.item.push({
|
||||||
|
level_money: "0",
|
||||||
|
level_point: "0",
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleDeleteLevel = (key) => {
|
||||||
|
form.value.item.splice(key, 1)
|
||||||
|
ElMessage.success("刪除成功")
|
||||||
|
}
|
||||||
|
|
||||||
|
const onSubmit = async() => {
|
||||||
|
let res = await setAffiliateConfig(form.value)
|
||||||
|
if(res.code === 200) {
|
||||||
|
ElMessage.success("設定成功")
|
||||||
|
}else{
|
||||||
|
ElMessage.error("設定失敗")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
info
|
<div class="main">
|
||||||
|
<!-- Breadcrumb: Start -->
|
||||||
|
<el-page-header :icon="null" title=" " @back="onBack">
|
||||||
|
<template #breadcrumb>
|
||||||
|
<el-breadcrumb separator="/">
|
||||||
|
<el-breadcrumb-item> 電商管理中心 </el-breadcrumb-item>
|
||||||
|
<el-breadcrumb-item>推薦設置</el-breadcrumb-item>
|
||||||
|
</el-breadcrumb>
|
||||||
|
</template>
|
||||||
|
<template #content>
|
||||||
|
<span class="text-large font-600 mr-3"> 推薦設置 </span>
|
||||||
|
</template>
|
||||||
|
</el-page-header>
|
||||||
|
<!-- Breadcrumb: End -->
|
||||||
|
<hr>
|
||||||
|
<el-form :model="form" label-width="120px">
|
||||||
|
<el-form-item label="是否開啟推薦">
|
||||||
|
<el-radio-group v-model="form.on">
|
||||||
|
<el-radio label="1">開啟</el-radio>
|
||||||
|
<el-radio label="0">關閉</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
<template v-if="form.on==='1'">
|
||||||
|
<el-form-item label="分成方式">
|
||||||
|
<el-radio-group v-model="form.config.separator_type">
|
||||||
|
<el-radio label="1">推薦註冊分成</el-radio>
|
||||||
|
<el-radio label="2">推薦訂單分成</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="推薦時效">
|
||||||
|
<el-input v-model="form.config.expire" placeholder="">
|
||||||
|
<template #append>Hour</template>
|
||||||
|
</el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="推薦分成">
|
||||||
|
<el-input v-model="form.config.level_money_all" placeholder="">
|
||||||
|
<template #append>%</template>
|
||||||
|
</el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item v-if="form.config.separator_type === '1'">
|
||||||
|
<div class="list-div">
|
||||||
|
<div class="level-op-btn">
|
||||||
|
<el-button type="primary" @click="handleAddLevel">增加層級</el-button>
|
||||||
|
</div>
|
||||||
|
<table class="table table-borderd">
|
||||||
|
<tr>
|
||||||
|
<th>級別</th>
|
||||||
|
<th>現金分成(%)</th>
|
||||||
|
<th>積分分成(%)</th>
|
||||||
|
<th>操作</th>
|
||||||
|
</tr>
|
||||||
|
<tr v-for="(v, k) in form.item" :key="k">
|
||||||
|
<td>
|
||||||
|
{{ k + 1 }}
|
||||||
|
</td>
|
||||||
|
<td> <el-input v-model="v.level_money" placeholder="">
|
||||||
|
<template #append>%</template>
|
||||||
|
</el-input>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<el-input v-model="v.level_point" placeholder="">
|
||||||
|
<template #append>%</template>
|
||||||
|
</el-input>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<el-icon @click="handleDeleteLevel(k)">
|
||||||
|
<delete />
|
||||||
|
</el-icon>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</el-form-item>
|
||||||
|
</template>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" @click="onSubmit">確定</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
</template >
|
</template >
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
.el-input {
|
||||||
|
max-width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.list-div {
|
||||||
|
table {
|
||||||
|
width: 100%;
|
||||||
|
background-color: #eee;
|
||||||
|
|
||||||
|
td {
|
||||||
|
padding: 0.25rem;
|
||||||
|
vertical-align: middle;
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
td:first-child {
|
||||||
|
width: 50px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
td:last-child {
|
||||||
|
width: 50px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-input {
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-borderd {
|
||||||
|
border: 1px solid #dee2e6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.level-op-btn {
|
||||||
|
padding: 10px;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
Loading…
Reference in new issue