553 lines
22 KiB
Vue
553 lines
22 KiB
Vue
<template>
|
||
<div class="tab-content" id="PTtab-11" :key="'PTtab-11'" >
|
||
<div>
|
||
<div class="pagenamPT">
|
||
<h3 class="pagename2 w100w">요율설정</h3>
|
||
</div>
|
||
<p class="rateTxt">하부회원의 최대 요율은 내 상위요율을 넘을 수 없습니다. 최소요율은 해당회원의 하부 최대 요율보다 낮을 수 없습니다.</p>
|
||
|
||
<div class="pagenamPT2">
|
||
<h3>내 요율</h3>
|
||
</div>
|
||
<div class="strTablescr top">
|
||
<div class="strTablePC">
|
||
<table class="strTablePT" v-if="myRateInfo">
|
||
<colgroup>
|
||
<col width="">
|
||
</colgroup>
|
||
<thead>
|
||
<tr>
|
||
<th></th>
|
||
<template v-for="cate in myRateInfo" :key="cate.cateCode">
|
||
<template v-if="cate.cateCodeName === 'HC-카지노'">
|
||
<th>호텔카지노</th>
|
||
</template>
|
||
<template v-else>
|
||
<th>{{ cate.cateCodeName }}</th>
|
||
</template>
|
||
</template>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<th>롤링(%)</th>
|
||
<template v-for="cate in myRateInfo" :key="cate.cateCode">
|
||
<td>{{ cate.pointRate }}</td>
|
||
</template>
|
||
</tr>
|
||
|
||
<tr>
|
||
<th>루징(%)</th>
|
||
<template v-for="cate in myRateInfo" :key="cate.cateCode">
|
||
<td>{{ cate.loseRate }}</td>
|
||
</template>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<div class="strTableM">
|
||
<div class="strTablePTM">
|
||
<ul>
|
||
<template v-for="cate in myRateInfo" :key="cate.cateCode">
|
||
<template v-if="cate.cateCodeName === 'HC-카지노'">
|
||
<li>
|
||
<em>호텔카지노 롤링</em>
|
||
<span>{{ cate.pointRate }}</span>
|
||
</li>
|
||
<li>
|
||
<em>호텔카지노 루징</em>
|
||
<span>{{ cate.loseRate }}</span>
|
||
</li>
|
||
</template>
|
||
<template v-else>
|
||
<li>
|
||
<em>{{ cate.cateCodeName }} 롤링</em>
|
||
<span>{{ cate.pointRate }}</span>
|
||
</li>
|
||
<li>
|
||
<em>{{ cate.cateCodeName }} 루징</em>
|
||
<span>{{ cate.loseRate }}</span>
|
||
</li>
|
||
</template>
|
||
</template>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="pagenamPT2">
|
||
<h3>하부 요율</h3>
|
||
</div>
|
||
<div class="strTablescr bottom">
|
||
<div class="strTablePC">
|
||
<div class="strTablePTIn">
|
||
<table class="strTablePT tableA" v-if="bottomRateList">
|
||
<thead>
|
||
<tr>
|
||
<th rowspan="2">아이디</th>
|
||
<th rowspan="2">닉네임</th>
|
||
<th rowspan="2">파트너등급</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<template v-for="item in bottomRateList" :key="item.memId">
|
||
<tr>
|
||
<td><div>{{ item.memId }}</div></td>
|
||
<td><div>{{ item.memNick }}</div></td>
|
||
<td>
|
||
<div>
|
||
<template v-if="item.partnerLevelName === '대본사'">
|
||
<span class="box">본사</span>
|
||
</template>
|
||
<template v-else-if="item.partnerLevelName === '부본사'">
|
||
<span class="box">부본</span>
|
||
</template>
|
||
<template v-else-if="item.partnerLevelName === '일반회원'">
|
||
<span class="box">회원</span>
|
||
</template>
|
||
<template v-else>
|
||
<span class="box">{{item.partnerLevelName}}</span>
|
||
</template>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
</template>
|
||
</tbody>
|
||
</table>
|
||
|
||
<div class="strTablePTWrap">
|
||
<table class="strTablePT" v-if="bottomRateList">
|
||
<thead>
|
||
<tr>
|
||
<template v-for="cate in myRateInfo" :key="cate.cateCode">
|
||
<template v-if="cate.cateCodeName === '하이로우88'">
|
||
<th rowspan="2" colspan="2">{{ cate.cateCodeName }}</th>
|
||
</template>
|
||
<template v-else-if="cate.cateCodeName === 'HC-카지노'">
|
||
<th colspan="2">호텔카지노</th>
|
||
</template>
|
||
<template v-else>
|
||
<th colspan="2" >{{ cate.cateCodeName }}</th>
|
||
</template>
|
||
</template>
|
||
</tr>
|
||
<tr>
|
||
<template v-for="cate in myRateInfo" :key="cate.cateCode">
|
||
<template v-if="cate.detailSetYn === 'N'">
|
||
<th>롤링</th>
|
||
<th>루징</th>
|
||
</template>
|
||
<!--template v-else>
|
||
</template-->
|
||
</template>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<template v-for="item in bottomRateList" :key="item.memId">
|
||
<tr>
|
||
<template v-for="cate in item.botRateInfo" :key="cate.cateCode">
|
||
<template v-if="cate.detailSetYn === 'N'">
|
||
<td>
|
||
<div class="rate">
|
||
<input type="text" v-model="cate.pointRate" @change="onRateChange(cate, 'P', item)">
|
||
<em>
|
||
<i>최소({{cate.minPointRate}})</i>
|
||
<i>최대({{cate.maxPointRate}})</i>
|
||
</em>
|
||
</div>
|
||
</td>
|
||
<td>
|
||
<div class="rate">
|
||
<input type="text" v-model="cate.loseRate" @change="onRateChange(cate, 'R', item)">
|
||
<em>
|
||
<i>최소({{cate.minLoseRate}})</i>
|
||
<i>최대({{cate.maxLoseRate}})</i>
|
||
</em>
|
||
</div>
|
||
</td>
|
||
</template>
|
||
<template v-else>
|
||
<td colspan="2">
|
||
<button class="detailSet" @click="onToggleDetail(item, cate)">세부설정</button>
|
||
</td>
|
||
</template>
|
||
</template>
|
||
</tr>
|
||
</template>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<table class="strTablePT tableC" v-if="bottomRateList">
|
||
<thead>
|
||
<tr>
|
||
<th rowspan="2">저장</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<template v-for="item in bottomRateList" :key="item.memId">
|
||
<tr>
|
||
<td>
|
||
<div>
|
||
<a class="btnx sbtn" @click="onSave(item)">{{$t('front.stributor.save')}}</a>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
</template>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<div class="detailSetWrap detailLosing" v-if="isDetailOpen">
|
||
<table>
|
||
<tbody>
|
||
<template v-for="rate in selectedMember.rateList" :key="rate.rateType">
|
||
<tr>
|
||
<td rowspan="2" class="tableheadside">{{rate.rateTypeName}}</td>
|
||
<td>롤링</td>
|
||
<td>
|
||
<button class="btnm">최소<i>({{rate.minPointRate}})</i></button>
|
||
<input type="text" :class="{'error': rate.errorP}" v-model="rate.pointRate" @change="onRateChange(rate, 'P')">
|
||
<button class="btnx">최대<i>({{rate.maxPointRate}})</i></button>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>루징</td>
|
||
<td>
|
||
<button class="btnm">최소<i>({{rate.minLoseRate}})</i></button>
|
||
<input type="text" :class="{'error': rate.errorR}" v-model="rate.loseRate" @change="onRateChange(rate, 'R')">
|
||
<button class="btnx">최대<i>({{rate.maxLoseRate}})</i></button>
|
||
</td>
|
||
</tr>
|
||
</template>
|
||
</tbody>
|
||
</table>
|
||
<button class="detailSetSave" @click="onSaveDetail">저장</button>
|
||
<span class="detailClose" @click="onToggleDetail()">×</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="strTableM">
|
||
<div class="strTablePTM" v-if="bottomRateList">
|
||
<template v-for="item in bottomRateList" :key="item.memId">
|
||
<ul>
|
||
<li><em>아이디</em><span>{{ item.memId }}</span></li>
|
||
<li><em>닉네임</em>{{ item.memNick }}</li>
|
||
<li><em>파트너등급</em><span class="box">{{item.partnerLevelName}}</span></li>
|
||
<template v-for="cate in item.botRateInfo" :key="cate.cateCode">
|
||
<template v-if="cate.detailSetYn === 'N'">
|
||
<template v-if="cate.cateCodeName === 'HC-카지노'">
|
||
<li>
|
||
<em>호텔카지노 롤링</em>
|
||
<div>
|
||
<input type="text" v-model="cate.pointRate" @change="onRateChange(cate, 'P', item)">
|
||
<span class="rate">
|
||
<i>최소({{cate.minPointRate}})</i>
|
||
<i>최대({{cate.maxPointRate}})</i>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
<li>
|
||
<em>호텔카지노 루징</em>
|
||
<div>
|
||
<input type="text" v-model="cate.loseRate" @change="onRateChange(cate, 'R', item)">
|
||
<span class="rate">
|
||
<i>최소({{cate.minLoseRate}})</i>
|
||
<i>최대({{cate.maxLoseRate}})</i>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
</template>
|
||
<template v-else>
|
||
<li>
|
||
<em>{{ cate.cateCodeName }} 롤링</em>
|
||
<div>
|
||
<input type="text" v-model="cate.pointRate" @change="onRateChange(cate, 'P', item)">
|
||
<span class="rate">
|
||
<i>최소({{cate.minPointRate}})</i>
|
||
<i>최대({{cate.maxPointRate}})</i>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
<li>
|
||
<em>{{ cate.cateCodeName }} 루징</em>
|
||
<div>
|
||
<input type="text" v-model="cate.loseRate" @change="onRateChange(cate, 'R', item)">
|
||
<span class="rate">
|
||
<i>최소({{cate.minLoseRate}})</i>
|
||
<i>최대({{cate.maxLoseRate}})</i>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
</template>
|
||
</template>
|
||
<template v-else>
|
||
<li>
|
||
<em>하이로우88</em>
|
||
<div><button class="detailSet" @click="onToggleDetail(item, cate)">세부설정</button></div>
|
||
</li>
|
||
</template>
|
||
</template>
|
||
<li><a class="btnx sbtn" @click="onSave(item)">{{$t('front.stributor.save')}}</a></li>
|
||
</ul>
|
||
</template>
|
||
<!--template v-else>
|
||
<ul>
|
||
<li>내역 없음</li>
|
||
</ul>
|
||
</template-->
|
||
<div class="detailSetWrap detailLosing" v-if="isDetailOpen">
|
||
<table>
|
||
<tbody>
|
||
<template v-for="rate in selectedMember.rateList" :key="rate.rateType">
|
||
<tr>
|
||
<td rowspan="2" class="tableheadside">{{rate.rateTypeName}}</td>
|
||
<td>롤링</td>
|
||
<td>
|
||
<button class="btnm">최소<i>({{rate.minPointRate}})</i></button>
|
||
<input type="text" :class="{'error': rate.errorP}" v-model="rate.pointRate" @change="onRateChange(rate, 'P')">
|
||
<button class="btnx">최대<i>({{rate.maxPointRate}})</i></button>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>루징</td>
|
||
<td>
|
||
<button class="btnm">최소<i>({{rate.minLoseRate}})</i></button>
|
||
<input type="text" :class="{'error': rate.errorR}" v-model="rate.loseRate" @change="onRateChange(rate, 'R')">
|
||
<button class="btnx">최대<i>({{rate.maxLoseRate}})</i></button>
|
||
</td>
|
||
</tr>
|
||
</template>
|
||
</tbody>
|
||
</table>
|
||
<button class="detailSetSave" @click="onSaveDetail">저장</button>
|
||
<span class="detailClose" @click="onToggleDetail()">×</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!------------------------------------------------------------------------------->
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { mapState } from 'vuex'
|
||
import { getRateInfo, memberNewRateUpdate, setMultipleRateInfo } from '@/api/retail'
|
||
|
||
export default {
|
||
name: 'PartnerRate',
|
||
components: {
|
||
},
|
||
computed: {
|
||
...mapState([
|
||
'userData',
|
||
'gameCount',
|
||
'commonCodeByOrder',
|
||
'commonCodeByCode',
|
||
'siteIdInfo'
|
||
])
|
||
},
|
||
watch: {
|
||
|
||
},
|
||
data () {
|
||
return {
|
||
myRateInfo: null,
|
||
bottomRateList: null,
|
||
isDetailOpen: false,
|
||
selectedMember: null
|
||
}
|
||
},
|
||
async created () {
|
||
await this.loadRate()
|
||
},
|
||
methods: {
|
||
onSaveDetail () {
|
||
this.emitter.emit('Loading', true)
|
||
const cate = this.selectedMember
|
||
console.log(cate)
|
||
if (!cate.errorP && !cate.errorR) {
|
||
const miniParam = {
|
||
memId: cate.memId,
|
||
vendorCode: cate.vendorCode,
|
||
rateList: cate.rateList
|
||
}
|
||
|
||
console.log(miniParam)
|
||
|
||
setMultipleRateInfo(miniParam).then(res => {
|
||
if (res.resultCode !== '0') {
|
||
alert(res.resultMessage)
|
||
} else {
|
||
alert('저장이 완료되었습니다.')
|
||
this.onToggleDetail()
|
||
}
|
||
|
||
this.emitter.emit('Loading', false)
|
||
})
|
||
}
|
||
},
|
||
onToggleDetail (item, cate) {
|
||
this.emitter.emit('Loading', true)
|
||
console.log(item, cate)
|
||
if (!this.isDetailOpen) {
|
||
this.selectedMember = {
|
||
...cate.multipleRateInfo,
|
||
errorP: item.errorP,
|
||
errorR: item.errorR
|
||
}
|
||
} else {
|
||
this.selectedMember = null
|
||
}
|
||
this.isDetailOpen = !this.isDetailOpen
|
||
this.emitter.emit('Loading', false)
|
||
},
|
||
onSave (item) {
|
||
console.log(item)
|
||
this.emitter.emit('Loading', true)
|
||
const isError = false
|
||
|
||
let rateList = []
|
||
|
||
if (item.botRateInfo) {
|
||
item.botRateInfo.forEach(cate => {
|
||
if (!cate.errorP && !cate.errorR) {
|
||
// if (cate.detailSetYn === 'Y') {
|
||
// if (!cate.errorP && !cate.errorR) {
|
||
// const miniParam = {
|
||
// memId: item.memId,
|
||
// vendorCode: cate.cateCode,
|
||
// rateList: cate.multipleRateInfo.rateList
|
||
// }
|
||
//
|
||
// setMultipleRateInfo(miniParam).then(res => {
|
||
// if (res.resultCode !== '0') {
|
||
// alert(res.resultMessage)
|
||
// }
|
||
// })
|
||
// }
|
||
// }
|
||
|
||
rateList.push({
|
||
category: cate.category,
|
||
cateCode: cate.cateCode,
|
||
pointRate: cate.pointRate,
|
||
loseRate: cate.loseRate
|
||
})
|
||
} else {
|
||
rateList = []
|
||
return false
|
||
}
|
||
})
|
||
}
|
||
|
||
console.log(rateList, isError)
|
||
|
||
if (rateList.length > 0 && !isError && item.botRateInfo.length === rateList.length) {
|
||
const params = {
|
||
siteId: this.siteIdInfo.siteId,
|
||
memId: item.memId,
|
||
rateList
|
||
}
|
||
|
||
memberNewRateUpdate(params).then(res => {
|
||
if (res.resultCode === '0') {
|
||
alert('저장 완료되었습니다.')
|
||
} else {
|
||
alert(res.resultMessage)
|
||
}
|
||
this.emitter.emit('Loading', false)
|
||
})
|
||
} else {
|
||
this.emitter.emit('Loading', false)
|
||
}
|
||
},
|
||
onRateChange (item, type, category) {
|
||
if (category) {
|
||
category['error' + type] = false
|
||
} else {
|
||
item['error' + type] = false
|
||
}
|
||
|
||
const max = type === 'P' ? item.maxPointRate : item.maxLoseRate
|
||
const min = type === 'P' ? item.minPointRate : item.minLoseRate
|
||
const value = type === 'P' ? item.pointRate : item.loseRate
|
||
|
||
if (Number(value) > Number(max)) {
|
||
if (category) {
|
||
category['error' + type] = true
|
||
} else {
|
||
item['error' + type] = true
|
||
}
|
||
} else if (Number(min) > Number(value)) {
|
||
if (category) {
|
||
category['error' + type] = true
|
||
} else {
|
||
item['error' + type] = true
|
||
}
|
||
}
|
||
},
|
||
loadRate () {
|
||
this.emitter.emit('Loading', true)
|
||
getRateInfo({}).then(res => {
|
||
console.log(res)
|
||
const result = res.data
|
||
|
||
if (result.resultCode === '0') {
|
||
this.myRateInfo = result.data.myRateInfo
|
||
this.bottomRateList = result.data.botttomRateList
|
||
|
||
this.bottomRateList.forEach(item => {
|
||
item.errorP = false
|
||
item.errorR = false
|
||
})
|
||
}
|
||
|
||
this.emitter.emit('Loading', false)
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
<style scoped>
|
||
.pagenamPT2 {font-size: 16px;font-weight: bold;margin: 20px 0;position: relative;color: #121212;display: flex;align-items: center;}
|
||
.strTablePTWrap {display: flex;width: calc(100% - 440px); overflow: auto;}
|
||
.strTablePTWrap table {white-space: nowrap;border-collapse: collapse;}
|
||
.strTablePTWrap th {padding: 0 5px;}
|
||
.strTablePTIn {display: flex;align-items: flex-start;min-width: 1430px;max-width: 1800px;}
|
||
.tableA th, .tableC th {height: 92px !important;}
|
||
.tableA div, .tableC div {
|
||
min-height: 35.8px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
.tableA {width: 300px !important;}
|
||
.tableC {width: 140px !important;}
|
||
.strTablePT {border-top: 5px solid #82a6a4;}
|
||
.top .strTablePT {display: table;table-layout: fixed;}
|
||
.strTablePT th {background: #EEF0F5 !important;border: 1px solid #e1e0e0;}
|
||
.strTablePT tr td {background: #fff !important;}
|
||
.strTablePT tr td i {font-size: 12px;color: #1200ff;}
|
||
.strTablePT tr td i:first-child {color: #f00;}
|
||
.strTablePT tr td .rate {display: flex;align-items: center;justify-content: center;gap: 5px;padding-left: 5px;box-sizing: border-box; min-height: 35.8px;}
|
||
.strTablePT tr td .rate em {display: flex;flex-direction: column;gap: 2px;width: 62px;align-items: flex-start;}
|
||
table input[type=text], .bottom input[type=text] {width: 50px;height: 28px;padding: 0 0 0 5px;margin: 0;border-radius: 0;border: 1px solid #bdbdbd;box-sizing: border-box;}
|
||
table .btnm, table .btnx, .bottom .btnm, .bottom .btnx {height: 28px;border-radius: 5px;font-size: 12px;margin: 0 auto;cursor: pointer;}
|
||
.sbtn {display: flex; align-items: center;justify-content: center;}
|
||
.rateTxt {font-size: 12px;line-height: 1.5em;margin-bottom: 10px;}
|
||
.detailSetWrap {position: fixed !important;}
|
||
.detailSetWrap.detailLosing {background: #fff;border: 1px solid #C2C2C2;}
|
||
table .detailSet, ul .detailSet {background-image: linear-gradient(to bottom, #72a2c1, #5f8bb1);border: 0;color: #fff;height: 28px;border-radius: 5px;}
|
||
.detailSetWrap tr > td:last-child input {padding-left: 5px;box-sizing: border-box;}
|
||
.detailClose {color: #000 !important;}
|
||
@media (max-width: 1000px) {
|
||
.strTablePTM li:nth-child(4) {width: 50% !important;}
|
||
.bottom .strTablePTM li {width: 100% !important;}
|
||
.strTablePTM em {width: 100px !important;}
|
||
.strTablePTM li .rate i:first-child {color: #f00;}
|
||
.strTablePTM li .rate i {font-size: 12px;color: #1200ff;margin-left: 5px;}
|
||
}
|
||
</style>
|
||
<style scoped src="@/styles/striNew.css"></style>
|