允许更新联盟账号的部分属性

src/api/taobao.ts

@@ -17,6 +17,16 @@ export function updateCookies(data: UpdateCookieModel) {
     return axios.post<FormRes>('/api/taobao/updateCookies', data);
 }
 
+export interface TkUpdateAccountModel {
+    id: number;
+    name: string;
+    val: any;
+}
+
+export function TkUpdateAccount(data: UpdateTkAccountModel) {
+    return axios.post<FormRes>('/api/taobao/update', data);
+}
+
 // list
 export interface TkPoolRecord {
     id: number;
@@ -32,8 +42,14 @@ export interface TkPoolRecord {
     last_time: Date;
     nodeName: string;
     refpid: string;
-    status: '' | 'online' | 'offline';
+    status: boolean;
     tb_token: string;
+    daily_income_limit: number;
+    api: string;
+    api_id: number;
+    end_point: string;
+    api_id: number;
+    enable_fake_click: boolean;
 }
 export interface TkPoolParams extends Partial<TkPoolRecord> {
     current: number;

src/locale/en-US/taoke.ts

@@ -15,6 +15,7 @@ export default {
   'form.reset': 'Reset',
   'form.button.check': 'View',
 
+  'menu.taobao.income_report': 'Income Report',
   'menu.taobao.report_daily': 'Daily Report',
   'menu.taobao.bill_dailys': 'Expected revenue',
   'menu.taobao.orders': 'Orders',

src/locale/zh-CN/taoke.ts

@@ -15,7 +15,8 @@ export default {
   'form.reset': '重置',
   'form.button.withdraw': '撤回',
 
-  'menu.taobao.report_daily': '收入报表',
+  'menu.taobao.income_report': '收入报表',
+  'menu.taobao.report_daily': '收入列表',
   'menu.taobao.bill_dailys': '联盟预计收益',
   'menu.taobao.orders': '联盟推广订单',
 

src/router/routes/modules/taobao.ts

@@ -32,6 +32,16 @@ const TAOBAO: AppRouteRecordRaw = {
                 roles: ['*'],
             },
         },
+        {
+            path: 'income_report',
+            name: 'taobao_income_report',
+            component: () => import('@/views/taobao/income_report.vue'),
+            meta: {
+                locale: 'menu.taobao.income_report',
+                requiresAuth: true,
+                roles: ['*'],
+            },
+        },
         {
             path: 'report_daily',
             name: 'taobao_report_daily',

src/views/taobao/income_report.vue

@@ -0,0 +1,521 @@
+<template>
+    <div class="container">
+        <Breadcrumb :items="['menu.dashboard', 'menu.taobao.report_daily']" />
+        <a-card class="general-card" :title="$t('menu.taobao.report_daily')">
+            <a-row>
+                <a-col :flex="1">
+                    <a-form :model="formModel" :label-col-props="{ span: 6 }" :wrapper-col-props="{ span: 18 }"
+                        label-align="left">
+                        <a-row :gutter="16">
+                            <a-col :span="8">
+                                <a-form-item field="query_date" :label="$t('searchTable.form.report_date')">
+                                    <a-range-picker v-model="formModel.query_date" style="width: 100%"
+                                        @change="search" />
+                                </a-form-item>
+                            </a-col>
+                        </a-row>
+                    </a-form>
+                </a-col>
+                <a-divider style="height: 32px" direction="vertical" />
+                <a-col :flex="'86px'" style="text-align: right">
+                    <a-space direction="vertical" :size="18">
+                        <a-button type="primary" @click="search">
+                            <template #icon>
+                                <icon-search />
+                            </template>
+                            {{ $t('searchTable.form.search') }}
+                        </a-button>
+                    </a-space>
+                </a-col>
+            </a-row>
+            <a-divider style="margin-top: 0" />
+            <a-row style="margin-bottom: 16px">
+                <a-col :span="12"> </a-col>
+                <a-col :span="12" style="
+                        display: flex;
+                        align-items: center;
+                        justify-content: end;
+                    ">
+                    <a-tooltip :content="$t('searchTable.actions.refresh')">
+                        <div class="action-icon" @click="search"><icon-refresh size="18" /></div>
+                    </a-tooltip>
+                    <a-dropdown @select="handleSelectDensity">
+                        <a-tooltip :content="$t('searchTable.actions.density')">
+                            <div class="action-icon"><icon-line-height size="18" /></div>
+                        </a-tooltip>
+                        <template #content>
+                            <a-doption v-for="item in densityList" :key="item.value" :value="item.value"
+                                :class="{ active: item.value === size }">
+                                <span>{{ item.name }}</span>
+                            </a-doption>
+                        </template>
+                    </a-dropdown>
+                    <a-tooltip :content="$t('searchTable.actions.columnSetting')">
+                        <a-popover trigger="click" position="bl" @popup-visible-change="popupVisibleChange">
+                            <div class="action-icon"><icon-settings size="18" /></div>
+                            <template #content>
+                                <div id="tableSetting">
+                                    <div v-for="(item, index) in showColumns" :key="item.dataIndex" class="setting">
+                                        <div style="
+                                                margin-right: 4px;
+                                                cursor: move;
+                                            ">
+                                            <icon-drag-arrow />
+                                        </div>
+                                        <div>
+                                            <a-checkbox v-model="item.checked" @change="
+                                                handleChange(
+                                                    $event,
+                                                    item as TableColumnData,
+                                                    index
+                                                )
+                                                ">
+                                            </a-checkbox>
+                                        </div>
+                                        <div class="title">
+                                            {{
+                                                item.title === '#'
+                                                    ? '序列号'
+                                                    : item.title
+                                            }}
+                                        </div>
+                                    </div>
+                                </div>
+                            </template>
+                        </a-popover>
+                    </a-tooltip>
+                </a-col>
+            </a-row>
+
+            <a-table row-key="id" :loading="loading" :pagination="pagination"
+                :columns="(cloneColumns as TableColumnData[])" :scroll="scroll" :scrollbar="scrollbar"
+                :data="renderData" :bordered="false" :size="size" :load-more="loadMore" @page-change="onPageChange">
+                <template #xAxis="{ record }">
+                    <template v-if="record.accountName !== '' && !record.isLeaf">
+                        {{ record.accountName }}
+                    </template>
+                    <template v-else>
+                        {{ dayjs(record.report_date).format(record.isLeaf ? 'HH:mm' : 'YYYY-MM-DD') }}
+                    </template>
+                </template>
+                <template #accountName="{ record }">
+                    {{ record.isLeaf ? '' : record.accountName }}
+                </template>
+                <template #total_count="{ record }">
+                    <a-popover v-if="record.total_count > 0" popup-container="body" trigger="click">
+                        <a-tag color="green">{{ record.total_count }}</a-tag>
+                        <template #content>
+                            <CategoriesPercent :record="record" />
+                        </template>
+                    </a-popover>
+                </template>
+            </a-table>
+        </a-card>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { useRouter } from 'vue-router';
+import dayjs from 'dayjs';
+import { computed, ref, reactive, watch, nextTick } from 'vue';
+import { useI18n } from 'vue-i18n';
+import useLoading from '@/hooks/loading';
+import {
+    queryTkReport,
+    queryTkReportDailys,
+    queryTkReportHourtrend,
+    TkReportRecord,
+    TkReportParams,
+} from '@/api/taobao';
+import { Pagination } from '@/types/global';
+import type {
+    TableData,
+    TableColumnData,
+} from '@arco-design/web-vue/es/table/interface';
+import cloneDeep from 'lodash/cloneDeep';
+import Sortable from 'sortablejs';
+import CategoriesPercent from './components/categories-percent.vue';
+
+type SizeProps = 'mini' | 'small' | 'medium' | 'large';
+type Column = TableColumnData & { checked?: true };
+
+const generateFormModel = () => {
+    return {
+        accountName: '',
+        query_date: [],
+        current: 1,
+        pageSize: 999,
+        sort: 'report_date',
+        order: 'descending',
+    };
+};
+const router = useRouter();
+
+const { loading, setLoading } = useLoading(true);
+const { t } = useI18n();
+const renderData = ref<TkReportRecord[]>([]);
+const formModel = ref(generateFormModel());
+const cloneColumns = ref<Column[]>([]);
+const showColumns = ref<Column[]>([]);
+
+const size = ref<SizeProps>('medium');
+
+const scrollbar = ref(true);
+const scroll = {
+    x: '100%',
+    y: '100%',
+    maxHeight: 'calc( 100vh - 420px)',
+};
+
+const basePagination: Pagination = {
+    current: 1,
+    pageSize: 20,
+};
+const pagination = reactive({
+    ...basePagination,
+});
+const densityList = computed(() => [
+    {
+        name: t('searchTable.size.mini'),
+        value: 'mini',
+    },
+    {
+        name: t('searchTable.size.small'),
+        value: 'small',
+    },
+    {
+        name: t('searchTable.size.medium'),
+        value: 'medium',
+    },
+    {
+        name: t('searchTable.size.large'),
+        value: 'large',
+    },
+]);
+
+const columns = computed<TableColumnData[]>(() => [
+    {
+        title: '日期',
+        dataIndex: 'xAxis',
+        slotName: 'xAxis',
+        width: 250,
+        fixed: 'left',
+    },
+    {
+        title: '点击人数',
+        dataIndex: 'uclk_uv_56',
+        width: 100,
+    },
+    {
+        title: '点击次数',
+        dataIndex: 'uclk_pv_56',
+        width: 100,
+    },
+    {
+        title: '点击次数(修正)',
+        dataIndex: 'fix_uclk_pv_56',
+        width: 130,
+    },
+    {
+        title: '付款笔数',
+        dataIndex: 'pay_ord_num_56',
+        width: 100,
+    },
+    {
+        title: '付款金额',
+        dataIndex: 'pay_ord_amt_56',
+        width: 120,
+    },
+    {
+        title: '付款预估收入',
+        dataIndex: 'pay_tk_disp_tfee_56',
+        width: 120,
+    },
+    {
+        title: '付款人数',
+        dataIndex: 'pay_ord_uv_56',
+        width: 100,
+    },
+    {
+        title: '有效付款笔数',
+        dataIndex: 'eff_ord_num',
+        width: 150,
+    },
+    {
+        title: '有效付款金额',
+        dataIndex: 'eff_ord_amt',
+        width: 150,
+    },
+    {
+        title: '有效付款预估收入',
+        dataIndex: 'eff_tk_disp_tfee',
+        width: 150,
+    },
+    {
+        title: '结算笔数',
+        dataIndex: 'sett_ord_num_56',
+        width: 100,
+    },
+    {
+        title: '结算金额',
+        dataIndex: 'sett_ord_amt_56',
+        width: 120,
+    },
+    {
+        title: '结算预估收入',
+        dataIndex: 'sett_tk_disp_tfee_56',
+        width: 150,
+    },
+    {
+        title: '最后更新时间',
+        dataIndex: 'last_time',
+        width: 200,
+    },
+    {
+        title: 'API调用',
+        dataIndex: 'total_count',
+        slotName: 'total_count',
+        width: 100,
+    },
+    {
+        title: '转链成功',
+        dataIndex: 'success_count',
+        width: 100,
+    },
+    {
+        title: '转链成功(%)',
+        dataIndex: 'success_percentage',
+        width: 110,
+    },
+    {
+        title: '放弃转链',
+        dataIndex: 'abandon_count',
+        width: 100,
+    },
+    {
+        title: '放弃转链(%)',
+        dataIndex: 'abandon_percentage',
+        width: 110,
+    },
+    {
+        title: '收藏人数',
+        dataIndex: 'uclt_uv_56',
+        width: 100,
+    },
+    {
+        title: '加购人数',
+        dataIndex: 'ucart_uv_56',
+        width: 100,
+    },
+    {
+        title: '定金笔数',
+        dataIndex: 'dep_ord_num_56',
+        width: 100,
+    },
+    {
+        title: '定金金额',
+        dataIndex: 'dep_ord_dep_amt_56',
+        width: 120,
+    },
+]);
+
+const fetchData = async (
+    params: TkReportParams = {
+        current: 1,
+        pageSize: 20,
+        sort: 'report_date',
+        order: 'descending',
+    }
+) => {
+    setLoading(true);
+    try {
+        const { data } = await queryTkReportDailys(params);
+        console.log(data);
+        if (!data) return;
+        renderData.value = data.list;
+        pagination.current = data.page;
+        pagination.total = data.count;
+        console.log(data);
+    } catch (err) {
+        console.log(err);
+        // you can report use errorHandler or other
+    } finally {
+        setLoading(false);
+    }
+};
+
+const loadMore = async (
+    row: TableData,
+    done: (data: TableData[]) => void
+) => {
+    setLoading(true);
+    try {
+        let list: TableData[] = [];
+
+        if (row.accountName === '') {
+            const params: TkReportParams = {
+                query_date: [row.report_date, row.report_date],
+                current: 1,
+                pageSize: 999,
+                sort: 'report_date',
+                order: 'descending',
+            };
+
+            const { data } = await queryTkReport(params);
+            console.log(data);
+            if (!data) return;
+            list = data.list.map((item: TkReportRecord) => ({
+                ...item,
+                isLeaf: false,
+            }));
+        } else {
+            const params: TkReportParams = {
+                query_date: [row.report_date, row.report_date],
+                accountName: row.accountName,
+                current: 1,
+                pageSize: 24,
+                sort: 'report_date',
+                order: 'descending',
+            };
+
+            const { data } = await queryTkReportHourtrend(params);
+            console.log(data);
+            if (!data) return;
+            list = data.list.map((item: TkReportRecord) => ({
+                ...item,
+                isLeaf: true,
+            }));
+        }
+        done(list);
+    } catch (err) {
+        console.log(err);
+        // you can report use errorHandler or other
+    } finally {
+        setLoading(false);
+    }
+};
+
+const search = () => {
+    fetchData({
+        ...basePagination,
+        ...formModel.value,
+    } as unknown as TkReportParams);
+};
+const onPageChange = (current: number) => {
+    fetchData({ ...basePagination, current });
+};
+
+fetchData();
+const reset = () => {
+    formModel.value = generateFormModel();
+};
+
+const handleSelectDensity = (
+    val: string | number | Record<string, any> | undefined,
+    e: Event
+) => {
+    size.value = val as SizeProps;
+};
+
+const handleChange = (
+    checked: boolean | (string | boolean | number)[],
+    column: Column,
+    index: number
+) => {
+    if (!checked) {
+        cloneColumns.value = showColumns.value.filter(
+            (item) => item.dataIndex !== column.dataIndex
+        );
+    } else {
+        cloneColumns.value.splice(index, 0, column);
+    }
+};
+
+const exchangeArray = <T extends Array<any>>(
+    array: T,
+    beforeIdx: number,
+    newIdx: number,
+    isDeep = false
+): T => {
+    const newArray = isDeep ? cloneDeep(array) : array;
+    if (beforeIdx > -1 && newIdx > -1) {
+        // 先替换后面的，然后拿到替换的结果替换前面的
+        newArray.splice(
+            beforeIdx,
+            1,
+            newArray.splice(newIdx, 1, newArray[beforeIdx]).pop()
+        );
+    }
+    return newArray;
+};
+
+const popupVisibleChange = (val: boolean) => {
+    if (val) {
+        nextTick(() => {
+            const el = document.getElementById(
+                'tableSetting'
+            ) as HTMLElement;
+            const sortable = new Sortable(el, {
+                onEnd(e: any) {
+                    const { oldIndex, newIndex } = e;
+                    exchangeArray(cloneColumns.value, oldIndex, newIndex);
+                    exchangeArray(showColumns.value, oldIndex, newIndex);
+                },
+            });
+        });
+    }
+};
+
+watch(
+    () => columns.value,
+    (val) => {
+        cloneColumns.value = cloneDeep(val);
+        cloneColumns.value.forEach((item, index) => {
+            item.checked = true;
+        });
+        showColumns.value = cloneDeep(cloneColumns.value);
+    },
+    { deep: true, immediate: true }
+);
+</script>
+
+<script lang="ts">
+export default {
+    name: 'SearchTable',
+};
+</script>
+
+<style scoped lang="less">
+.container {
+    padding: 0 20px 20px 20px;
+}
+
+:deep(.arco-table-th) {
+    &:last-child {
+        .arco-table-th-item-title {
+            margin-left: 16px;
+        }
+    }
+}
+
+.action-icon {
+    margin-left: 12px;
+    cursor: pointer;
+}
+
+.active {
+    color: #0960bd;
+    background-color: #e3f4fc;
+}
+
+.setting {
+    display: flex;
+    align-items: center;
+    width: 200px;
+
+    .title {
+        margin-left: 12px;
+        cursor: pointer;
+    }
+}
+</style>

src/views/taobao/list.vue

@@ -126,8 +126,29 @@
                     </a-tag>
                 </template>
                 <template #status="{ record }">
-                    <a-tag v-if="record.status" bordered color="green">在线</a-tag>
-                    <a-tag v-else bordered color="">下线</a-tag>
+                    <div style="margin:5px 5px 0 0;">
+                        <a-tag v-if="record.status" bordered color="green" @click="changeStatus(record.id, false)">
+                            <icon-check-circle-fill />在线
+                        </a-tag>
+                        <a-tag v-else bordered color="" @click="changeStatus(record.id, true)">
+                            <icon-close-circle-fill />下线
+                        </a-tag>
+                    </div>
+                    <div style="margin:5px 5px 0 0;">
+                        <a-tag v-if="record.enable_fake_click" bordered color="blue"
+                            @click="changeFakeClick(record.id, false)">
+                            <template #icon>
+                                <icon-check-circle-fill />
+                            </template>
+                            补点击
+                        </a-tag>
+                        <a-tag v-else bordered color="gray" @click="changeFakeClick(record.id, true)">
+                            <template #icon>
+                                <icon-stop />
+                            </template>
+                            补点击
+                        </a-tag>
+                    </div>
                 </template>
                 <template #operations="{ record }">
                     <a-button type="text" size="small" @click="changeItem(record)">
@@ -147,8 +168,9 @@ import { useRouter } from 'vue-router';
 import { computed, ref, reactive, watch, nextTick } from 'vue';
 import { useI18n } from 'vue-i18n';
 import useLoading from '@/hooks/loading';
-import { queryTkPool, TkPoolRecord, TkPoolParams } from '@/api/taobao';
+import { queryTkPool, TkPoolRecord, TkPoolParams, TkUpdateAccountModel, TkUpdateAccount } from '@/api/taobao';
 import { Pagination } from '@/types/global';
+import { Message } from '@arco-design/web-vue';
 import type { SelectOptionData } from '@arco-design/web-vue/es/select/interface';
 import type { TableColumnData } from '@arco-design/web-vue/es/table/interface';
 import cloneDeep from 'lodash/cloneDeep';
@@ -214,38 +236,47 @@ const columns = computed<TableColumnData[]>(() => [
         title: '账号名',
         dataIndex: 'name',
         slotName: 'name',
+        width: 200,
     },
     {
         title: '创建时间',
         dataIndex: 'create_time',
+        width: 180,
     },
     {
         title: '最后更新',
         dataIndex: 'last_time',
+        width: 180,
     },
     {
         title: '每日收益限额',
         dataIndex: 'daily_income_limit',
         slotName: 'daily_income_limit',
+        width: 180,
     },
     {
         title: '可提现余额',
         dataIndex: 'draw_balance',
         slotName: 'draw_balance',
+        width: 120,
     },
     {
         title: '运行节点',
         dataIndex: 'nodeName',
+        width: 120,
     },
     {
         title: '状态',
         dataIndex: 'status',
         slotName: 'status',
+        width: 100,
     },
     {
         title: '操作',
         dataIndex: 'operations',
         slotName: 'operations',
+        align: 'right',
+        width: 150,
     },
 ]);
 
@@ -296,9 +327,61 @@ const changeItem = async (data: TkPoolRecord) => {
 };
 
 const billView = async (data: TkPoolRecord) => {
-    router.push({ name: 'taobao_bill_dailys',query:{ name: data.company } });
+    router.push({ name: 'taobao_bill_dailys', query: { name: data.company } });
+};
+
+
+const changeStatus = async (id: number, val: any) => {
+    const args = {
+        id,
+        name: 'status',
+        val
+    } as TkUpdateAccountModel;
+
+    setLoading(true);
+
+    try {
+        const { data } = await TkUpdateAccount(args);
+        console.log(data, data.msg);
+        const msg = data.msg || '更新成功!';
+        if (data.success) {
+            Message.success(msg);
+            fetchData();
+        } else {
+            Message.error(data.msg);
+        }
+
+    } catch (e) { console.log(e) }
+    setLoading(false);
+};
+
+
+const changeFakeClick = async (id: number, val: any) => {
+    const args = {
+        id,
+        name: 'enable_fake_click',
+        val
+    } as TkUpdateAccountModel;
+
+    setLoading(true);
+    try {
+
+        const { data } = await TkUpdateAccount(args);
+        console.log(data, data.msg);
+        const msg = data.msg || '更新成功!';
+        if (data.success) {
+            Message.success(msg);
+            fetchData();
+        } else {
+            Message.error(data.msg);
+        }
+    } catch (e) { console.log(e) }
+    setLoading(false);
 };
 
+
+
+
 const search = () => {
     fetchData({
         ...basePagination,