fix
This commit is contained in:
X1627315083
306
src/component/Administrator/affiliate/affiliateAudit.vue
Normal file
306
src/component/Administrator/affiliate/affiliateAudit.vue
Normal file
@@ -0,0 +1,306 @@
|
||||
<template>
|
||||
<div class="admin_page">
|
||||
<div class="admin_table_search">
|
||||
<div class="admin_state">
|
||||
<div class="admin_state_item">
|
||||
<span>Start Time:</span>
|
||||
<a-range-picker
|
||||
style="width:280px"
|
||||
class="range_picker"
|
||||
v-model:value="rangePickerValue"
|
||||
:allowClear="false"
|
||||
:placeholder="[
|
||||
$t('HistoryPage.StartDate'),
|
||||
$t('HistoryPage.EndDate'),
|
||||
]"
|
||||
valueFormat="YYYY-MM-DD"
|
||||
>
|
||||
<template #suffixIcon>
|
||||
<span
|
||||
class="icon iconfont range_picker_icon icon-rili"
|
||||
></span>
|
||||
</template>
|
||||
</a-range-picker>
|
||||
</div>
|
||||
<div class="admin_state_item">
|
||||
<span>State:</span>
|
||||
<a-select v-model:value="currentState.value" size="large" style="width:280px" optionFilterProp="label" :options="state" placeholder="Please select" allowClear show-search></a-select>
|
||||
</div>
|
||||
<div class="admin_state_item">
|
||||
<span>Affiliate Id:</span>
|
||||
<input
|
||||
style="width:280px"
|
||||
v-model="affiliateId"
|
||||
placeholder="Please enter Affiliate Id"
|
||||
@keydown.enter="gettrialList"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="admin_search">
|
||||
<div class="admin_search_item" @click="searchHistoryList">Search</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="admin_table_content" ref="historyTable">
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="collectionList"
|
||||
:scroll="{ y: historyTableHeight }"
|
||||
@change="changePage"
|
||||
|
||||
>
|
||||
<template
|
||||
#bodyCell="{ column, text, record, index }"
|
||||
>
|
||||
<div
|
||||
class="operate_list"
|
||||
v-if="column?.Operations && record.status == 'Pending'"
|
||||
>
|
||||
<div v-show="status == 0" class="operate_item" @click="setAgree(record, true)">
|
||||
agree
|
||||
</div>
|
||||
<div v-show="status == 0" class="operate_item" @click="setAgree(record, false)" >
|
||||
refuse
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="column?.Operations">
|
||||
{{ record.status }}
|
||||
</div>
|
||||
<div v-else-if="column?.openType" @click="openDetail(record,column?.openType)">
|
||||
{{ text }} HDK
|
||||
</div>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
<itemAffiliateDetail ref="itemAffiliateDetail"></itemAffiliateDetail>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent, ref, createVNode, computed } from "vue";
|
||||
import { Https } from "@/tool/https";
|
||||
import { Modal, message } from "ant-design-vue";
|
||||
import itemAffiliateDetail from "./itemAffiliateDetail.vue";
|
||||
export default defineComponent({
|
||||
components: {
|
||||
itemAffiliateDetail,
|
||||
},
|
||||
setup() {
|
||||
let renameData: any = ref({}); //修改名字选中的数据
|
||||
const columns: any = computed(() => {
|
||||
return [
|
||||
{
|
||||
title: 'Id',
|
||||
align: "center",
|
||||
width: 50,
|
||||
dataIndex: "id",
|
||||
key: "id",
|
||||
fixed: "left",
|
||||
},
|
||||
{
|
||||
title: 'Create Time',
|
||||
align: "center",
|
||||
width: 200,
|
||||
dataIndex: "createTime",
|
||||
key: "createTime",
|
||||
sorter: true,
|
||||
},{
|
||||
title: 'State',
|
||||
align: "center",
|
||||
ellipsis: true,
|
||||
width: 100,
|
||||
dataIndex: "status",
|
||||
key: "status",
|
||||
|
||||
},{
|
||||
title: 'Updata Time',
|
||||
align: "center",
|
||||
width: 200,
|
||||
dataIndex: "updateTime",
|
||||
key: "updateTime",
|
||||
|
||||
},{
|
||||
title: 'Total income',
|
||||
align: "center",
|
||||
ellipsis: true,
|
||||
width: 100,
|
||||
dataIndex: "totalEarnings",
|
||||
key: "totalEarnings",
|
||||
openType:'month',
|
||||
},{
|
||||
title: 'Monthly income',
|
||||
align: "center",
|
||||
ellipsis: true,
|
||||
width: 100,
|
||||
dataIndex: "monthlyEarnings",
|
||||
key: "monthlyEarnings",
|
||||
openType:'all',
|
||||
},{
|
||||
title: 'Invitation Link',
|
||||
align: "center",
|
||||
ellipsis: true,
|
||||
width: 250,
|
||||
dataIndex: "link",
|
||||
key: "link",
|
||||
},{
|
||||
title: 'Unpaid amount',
|
||||
align: "center",
|
||||
ellipsis: true,
|
||||
width: 100,
|
||||
dataIndex: "unpaidEarnings",
|
||||
key: "unpaidEarnings",
|
||||
},
|
||||
{
|
||||
title: 'Operations',
|
||||
key: "operation",
|
||||
align: "center",
|
||||
fixed: "right",
|
||||
width: 130,
|
||||
// slots:{customRender:'action'}
|
||||
Operations: true,
|
||||
|
||||
},
|
||||
];
|
||||
});
|
||||
let currentState = ref({
|
||||
label:'All',
|
||||
value:'',
|
||||
state:false,
|
||||
},)
|
||||
let state:any = ref([
|
||||
{
|
||||
label:'All',
|
||||
value:'',
|
||||
},
|
||||
{
|
||||
label:'Pending',
|
||||
value:'Pending',
|
||||
},
|
||||
{
|
||||
label:'Active',
|
||||
value:'Active',
|
||||
},
|
||||
{
|
||||
label:'Inactive',
|
||||
value:'Inactive',
|
||||
},
|
||||
{
|
||||
label:'Refused',
|
||||
value:'Refused',
|
||||
},
|
||||
])
|
||||
const itemAffiliateDetail = ref()
|
||||
let collectionList: any = ref([]);
|
||||
let status: any = ref(0);
|
||||
const openDetail = (value:any,openType:string)=>{
|
||||
console.log(value,openType);
|
||||
let data = {
|
||||
id:value.id,
|
||||
type:openType
|
||||
}
|
||||
itemAffiliateDetail.value.init(data)
|
||||
}
|
||||
return {
|
||||
columns,
|
||||
collectionList,
|
||||
renameData,
|
||||
status,
|
||||
currentState,
|
||||
itemAffiliateDetail,
|
||||
state,
|
||||
openDetail,
|
||||
};
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
rangePickerValue:[],
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
total: 0,
|
||||
order:'',
|
||||
affiliateId:'',
|
||||
historyTableHeight: 0,
|
||||
newCollectionName: "",
|
||||
renameVisivle: false, //修改名字弹窗
|
||||
collectionName: "", //选中的名字
|
||||
searchCollectionName: "",
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
let historyTable: any = this.$refs.historyTable;
|
||||
this.historyTableHeight = historyTable.clientHeight - 200;
|
||||
this.gettrialList();
|
||||
},
|
||||
methods: {
|
||||
//改变页码
|
||||
changePage(e: any, filters:any, sorter:any) {
|
||||
this.currentPage = e.current;
|
||||
this.pageSize = e.pageSize;
|
||||
this.order = sorter.order == "descend" ? "DESC" : "ASC";
|
||||
this.gettrialList();
|
||||
},
|
||||
//查询列表
|
||||
searchHistoryList() {
|
||||
this.currentPage = 1;
|
||||
this.gettrialList();
|
||||
},
|
||||
//获取列表
|
||||
gettrialList() {
|
||||
let startDate: any = this.rangePickerValue?.[0]
|
||||
? this.rangePickerValue[0]+' '+'00:00:00'
|
||||
: "";
|
||||
let endDate: any = this.rangePickerValue?.[1]
|
||||
? this.rangePickerValue[1]+' '+'00:00:00'
|
||||
: "";
|
||||
let data = {
|
||||
page: this.currentPage,
|
||||
size: this.pageSize,
|
||||
order: this.order,
|
||||
status: this.currentState.value,
|
||||
startTime:startDate,
|
||||
endTime:endDate,
|
||||
affiliateId:this.affiliateId
|
||||
};
|
||||
Https.axiosPost(Https.httpUrls.affiliateList, data).then(
|
||||
(rv: any) => {
|
||||
this.collectionList = rv.records;
|
||||
this.total=rv.total
|
||||
}
|
||||
);
|
||||
},
|
||||
setAgree(record: any, boolean: boolean){
|
||||
// const formData = new FormData()
|
||||
// formData.append('id',record.id)
|
||||
// formData.append('isApproved ',boolean+'')
|
||||
let data = {
|
||||
id:record.id,
|
||||
isApproved: boolean,
|
||||
|
||||
}
|
||||
let config:any = {headers:{'Content-Type':'multipart/form-data','Accept':'*/*' }}
|
||||
Https.axiosGet(Https.httpUrls.affiliateApproval, {params:data}).then(
|
||||
(rv: any) => {
|
||||
if(boolean){
|
||||
message.success('同意成功~')
|
||||
}else{
|
||||
message.success('拒绝成功~')
|
||||
}
|
||||
this.gettrialList();
|
||||
}
|
||||
);
|
||||
},
|
||||
setState(){
|
||||
this.currentState.state = true
|
||||
},
|
||||
setStateItem(item:any){
|
||||
this.currentState = item
|
||||
this.currentState.state = false
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.admin_page .admin_table_content .operate_list{
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
||||
228
src/component/Administrator/affiliate/itemAffiliateDetail.vue
Normal file
228
src/component/Administrator/affiliate/itemAffiliateDetail.vue
Normal file
@@ -0,0 +1,228 @@
|
||||
<template>
|
||||
<div class="itemAffiliateDetail" ref="itemAffiliateDetail"></div>
|
||||
<a-modal class="generalModel"
|
||||
v-model:visible="itemAffiliateDetailShow"
|
||||
:footer="null"
|
||||
:get-container="() => $refs.itemAffiliateDetail"
|
||||
width="75%"
|
||||
:maskClosable="false"
|
||||
:centered="true"
|
||||
:closable="false"
|
||||
:mask="true"
|
||||
wrapClassName="#app"
|
||||
>
|
||||
<div class="generalModel_btn">
|
||||
<div class="generalModel_closeIcon" @click.stop="cancelDsign()">
|
||||
<svg width="46" height="46" viewBox="0 0 46 46" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle cx="23" cy="23" r="23" fill="white" fill-opacity="0.3"/>
|
||||
<rect x="32.5063" y="12" width="3" height="29" rx="1.5" transform="rotate(45 32.5063 12)" fill="white"/>
|
||||
<rect x="34.6274" y="32.5059" width="3" height="29" rx="1.5" transform="rotate(135 34.6274 32.5059)" fill="white"/>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="admin_page">
|
||||
<div class="admin_state_item">
|
||||
<span>Start Time:</span>
|
||||
<a-range-picker
|
||||
style="width:280px"
|
||||
class="range_picker"
|
||||
v-model:value="rangePickerValue"
|
||||
:allowClear="false"
|
||||
:placeholder="[
|
||||
$t('HistoryPage.StartDate'),
|
||||
$t('HistoryPage.EndDate'),
|
||||
]"
|
||||
valueFormat="YYYY-MM-DD"
|
||||
>
|
||||
<template #suffixIcon>
|
||||
<span
|
||||
class="icon iconfont range_picker_icon icon-rili"
|
||||
></span>
|
||||
</template>
|
||||
</a-range-picker>
|
||||
<div class="gallery_btn" @click="getDetailList" style="margin-left: 2rem;">Search</div>
|
||||
</div>
|
||||
<div class="itemAffiliateDetail_content generalModel_table_content" ref="historyTable">
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="collectionList"
|
||||
:scroll="{ y: 200 }"
|
||||
@change="changePage"
|
||||
:pagination="{
|
||||
showSizeChanger: true,
|
||||
current: currentPage,
|
||||
pageSize: pageSize,
|
||||
total: total,
|
||||
showQuickJumper: true,
|
||||
bordered: false,
|
||||
}"
|
||||
>
|
||||
</a-table>
|
||||
</div>
|
||||
</div>
|
||||
</a-modal>
|
||||
<div class="mark_loading" v-show="loadingShow">
|
||||
<a-spin size="large" />
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent, ref, createVNode, computed, reactive, toRefs, nextTick } from "vue";
|
||||
import { Https } from "@/tool/https";
|
||||
import { Modal, message } from "ant-design-vue";
|
||||
export default defineComponent({
|
||||
components: {
|
||||
},
|
||||
setup() {
|
||||
let renameData: any = ref({}); //修改名字选中的数据
|
||||
const itemAffiliateDom = reactive({
|
||||
historyTable:null as any,
|
||||
})
|
||||
const itemAffiliateDetail = reactive({
|
||||
itemAffiliateDetailShow:false,
|
||||
loadingShow:false,
|
||||
rangePickerValue:[] as any,
|
||||
itemId:-1,
|
||||
collectionList:[],
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
order:'',
|
||||
total: 0,
|
||||
historyTableHeight:0,
|
||||
columns:computed(() => {
|
||||
return [
|
||||
{
|
||||
title: 'Id',
|
||||
align: "center",
|
||||
width: 50,
|
||||
dataIndex: "accountId",
|
||||
key: "accountId",
|
||||
fixed: "left",
|
||||
},{
|
||||
title: 'User Name',
|
||||
key: "username",
|
||||
dataIndex: "username",
|
||||
align: "center",
|
||||
width: 150,
|
||||
},
|
||||
{
|
||||
title: 'Time',
|
||||
align: "center",
|
||||
width: 200,
|
||||
dataIndex: "time",
|
||||
key: "time",
|
||||
sorter: true,
|
||||
},{
|
||||
title: 'First Subscription Payment Amount',
|
||||
align: "center",
|
||||
width: 200,
|
||||
dataIndex: "firstSubscriptionPaymentAmount",
|
||||
key: "firstSubscriptionPaymentAmount",
|
||||
},{
|
||||
title: 'Commission',
|
||||
align: "center",
|
||||
ellipsis: true,
|
||||
width: 150,
|
||||
dataIndex: "commission",
|
||||
key: "commission",
|
||||
fixed: "right",
|
||||
}
|
||||
|
||||
];
|
||||
})
|
||||
})
|
||||
const init = (value:any)=>{
|
||||
itemAffiliateDetail.itemAffiliateDetailShow = true
|
||||
getCurrentMonthStart(value.type)
|
||||
nextTick(()=>{
|
||||
itemAffiliateDetail.historyTableHeight = itemAffiliateDom.historyTable.clientHeight - 40;
|
||||
itemAffiliateDetail.itemId = value.id
|
||||
getDetailList()
|
||||
})
|
||||
|
||||
}
|
||||
const cancelDsign = () =>{
|
||||
itemAffiliateDetail.itemAffiliateDetailShow = false
|
||||
itemAffiliateDetail.loadingShow = false
|
||||
}
|
||||
const getCurrentMonthStart = (type:any) => {
|
||||
const now = new Date(); // 获取当前日期
|
||||
const year = now.getFullYear(); // 获取当前年份
|
||||
const month = now.getMonth(); // 获取当前月份（0 - 11）
|
||||
let startOfPeriod:any, endOfPeriod:any;
|
||||
if (type === 'month') {
|
||||
startOfPeriod = new Date(year, month, 1);
|
||||
endOfPeriod = new Date(year, month + 1, 0); // 下个月的第0天即为当前月的最后一天
|
||||
|
||||
startOfPeriod.setHours(0, 0, 0, 0);
|
||||
endOfPeriod.setHours(23, 59, 59, 999); // 设置为最后一天的23:59:59.999
|
||||
} else if (type === 'year') {
|
||||
startOfPeriod = new Date(year, 0, 1);
|
||||
endOfPeriod = new Date(year, 11, 31);
|
||||
}
|
||||
|
||||
const formatDate = (date:any) => {
|
||||
return date.getFullYear() + '-' +
|
||||
String(date.getMonth() + 1).padStart(2, '0') + '-' +
|
||||
String(date.getDate()).padStart(2, '0') + ' ' +
|
||||
String(date.getHours()).padStart(2, '0') + ':' +
|
||||
String(date.getMinutes()).padStart(2, '0') + ':' +
|
||||
String(date.getSeconds()).padStart(2, '0');
|
||||
};
|
||||
if (type === 'month')itemAffiliateDetail.rangePickerValue = [formatDate(startOfPeriod),formatDate(endOfPeriod)]
|
||||
|
||||
}
|
||||
|
||||
|
||||
const changePage = (e: any, filters:any, sorter:any)=>{
|
||||
itemAffiliateDetail.currentPage = e.current;
|
||||
itemAffiliateDetail.pageSize = e.pageSize;
|
||||
itemAffiliateDetail.order = sorter.order == "descend" ? "DESC" : "ASC";
|
||||
getDetailList();
|
||||
}
|
||||
const getDetailList = ()=>{
|
||||
itemAffiliateDetail.loadingShow = true
|
||||
let startDate: any = itemAffiliateDetail.rangePickerValue?.[0]
|
||||
? itemAffiliateDetail.rangePickerValue[0]+' '+'00:00:00'
|
||||
: "";
|
||||
let endDate: any = itemAffiliateDetail.rangePickerValue?.[1]
|
||||
? itemAffiliateDetail.rangePickerValue[1]+' '+'00:00:00'
|
||||
: "";
|
||||
let data = {
|
||||
affiliateId:itemAffiliateDetail.itemId,
|
||||
endTime:endDate,
|
||||
startTime:startDate,
|
||||
order:itemAffiliateDetail.order,
|
||||
page: itemAffiliateDetail.currentPage,
|
||||
size: itemAffiliateDetail.pageSize,
|
||||
}
|
||||
Https.axiosPost(Https.httpUrls.getEachAffiliateGeneratedRevenue,data).then((rv:any)=>{
|
||||
console.log(rv);
|
||||
itemAffiliateDetail.collectionList = rv.records
|
||||
itemAffiliateDetail.loadingShow = false
|
||||
itemAffiliateDetail.total=rv.total
|
||||
}).catch((err:any)=>{
|
||||
itemAffiliateDetail.loadingShow = false
|
||||
})
|
||||
|
||||
}
|
||||
return {
|
||||
...toRefs(itemAffiliateDom),
|
||||
...toRefs(itemAffiliateDetail),
|
||||
init,
|
||||
cancelDsign,
|
||||
changePage,
|
||||
getDetailList,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.itemAffiliateDetail{
|
||||
.itemAffiliateDetail_content{
|
||||
margin-top: 2rem;
|
||||
}
|
||||
.admin_page .admin_table_content .operate_list{
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user