313 lines
8.7 KiB
Vue
313 lines
8.7 KiB
Vue
<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: 'User Name',
|
|
align: "center",
|
|
width: 100,
|
|
dataIndex: "username",
|
|
key: "username",
|
|
},
|
|
{
|
|
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: '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: 'Unpaid amount',
|
|
align: "center",
|
|
ellipsis: true,
|
|
width: 100,
|
|
dataIndex: "unpaidEarnings",
|
|
key: "unpaidEarnings",
|
|
},{
|
|
title: 'Invitation Link',
|
|
align: "center",
|
|
ellipsis: true,
|
|
width: 250,
|
|
dataIndex: "link",
|
|
key: "link",
|
|
},{
|
|
title: 'Updata Time',
|
|
align: "center",
|
|
width: 200,
|
|
dataIndex: "updateTime",
|
|
key: "updateTime",
|
|
|
|
},
|
|
{
|
|
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]+' '+'23:59:59'
|
|
: "";
|
|
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.content;
|
|
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> |