1128

.env.development

@@ -1,4 +1,3 @@
 VITE_API_BASE_URL= 'http://localhost:8186'
-VITE_API_BASE_URL= 'https://adminapi.molilian.com'
 
 VITE_API_BASE_SCOPE = 'admin'

src/api/aliyun.ts

@@ -0,0 +1,35 @@
+import axios from 'axios';
+import type { ListRes, FormRes } from './base';
+
+export interface AliyunAccountRecord {
+    id: number;
+    pin: string;
+    name: string;
+    username: string;
+    password: string;
+    company: string;
+    mobile: string;
+    accessKeyId: string;
+    accessKeySecret: string;
+    status: boolean;
+    create_time: Date;
+    last_time: Date;
+    balance: number;
+    regions: string;
+}
+
+export interface AliyunAccountParams extends Partial<AliyunAccountRecord> {
+    current: number;
+    pageSize: number;
+    sort?: string;
+    order?: string;
+    getTotal: boolean;
+}
+
+export interface AliyunAccountRes extends ListRes {
+    list: AliyunAccountRecord[];
+}
+
+export function queryAccountList(data: AliyunAccountParams) {
+    return axios.post<AliyunAccountRes>('/api/aliyun/account_list', data);
+}

src/api/jd.ts

@@ -3,6 +3,8 @@ import type { ListRes, FormRes } from './base';
 
 export interface UpdateCookieModel {
     cookie: string;
+    user_agent: string;
+    h5st: string;
 }
 
 export function updateCookies(data: UpdateCookieModel) {

src/locale/zh-CN/taoke.ts

@@ -1,6 +1,7 @@
 export default {
   'menu.settings': '系统设置',
   'menu.settings.config': '全局配置',
+  'menu.settings.aliyun': '阿里云资源管理',
 
   'menu.jd': '京东联盟',
   'menu.jd.updateCookies': '更新 JD Cookies',

src/router/routes/modules/settings.ts

@@ -12,6 +12,16 @@ const SETTINGS: AppRouteRecordRaw = {
     order: 99,
   },
   children: [
+    {
+      path: 'aliyun',
+      name: 'aliyun',
+      component: () => import('@/views/settings/aliyun.vue'),
+      meta: {
+        locale: 'menu.settings.aliyun',
+        requiresAuth: true,
+        roles: ['*'],
+      },
+    },
     {
       path: 'config',
       name: 'config',

src/views/jd/updateCookies.vue

@@ -8,9 +8,15 @@
                         :wrapper-col-props="{ span: 19 }">
                         <a-form-item field="cookie" :label="$t('taobao.cookies.label')" :rules="[{ required: true }]"
                             row-class="keep-margin">
-                            <a-textarea v-model="formData.cookie" auto-size class="cookie"
+                            <a-textarea v-model="formData.cookie"  :auto-size="{ minRows: 10 }" class="cookie"
                                 :placeholder="$t('taobao.cookies.placeholder')" />
                         </a-form-item>
+                        <a-form-item field="user_agent" label="User Agent" row-class="keep-margin">
+                            <a-textarea v-model="formData.user_agent" auto-size placeholder="留空的话，忽略更新" />
+                        </a-form-item>
+                        <a-form-item field="h5st" label="h5st" row-class="keep-margin">
+                            <a-textarea v-model="formData.h5st" :auto-size="{ minRows: 5 }" placeholder="留空的话，忽略更新" />
+                        </a-form-item>
                         <a-form-item>
                             <a-space>
                                 <a-button type="primary" @click="validate">
@@ -41,6 +47,8 @@ const router = useRouter();
 const formRef = ref<FormInstance>();
 const formData = ref<UpdateCookieModel>({
     cookie: '',
+    user_agent: '',
+    h5st: '',
 });
 const validate = async () => {
     const res = await formRef.value?.validate();

src/views/settings/aliyun.vue

@@ -0,0 +1,429 @@
+<template>
+    <div class="container">
+        <Breadcrumb :items="['menu.jd', 'menu.jd.list']" />
+        <a-card class="general-card" :title="$t('menu.jd.list')">
+            <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="name" label="账号名">
+                                    <a-input v-model="formModel.name" placeholder="输入关键词搜索" />
+                                </a-form-item>
+                            </a-col>
+                            <a-col :span="8">
+                                <a-form-item field="lastTime" :label="$t('searchTable.form.lastTime')">
+                                    <a-range-picker v-model="formModel.lastTime" style="width: 100%" />
+                                </a-form-item>
+                            </a-col>
+                            <a-col :span="8">
+                                <a-form-item field="status" :label="$t('searchTable.form.status')">
+                                    <a-select v-model="formModel.status" :options="statusOptions" :placeholder="$t('searchTable.form.selectDefault')
+                                        " />
+                                </a-form-item>
+                            </a-col>
+                        </a-row>
+                    </a-form>
+                </a-col>
+                <a-divider style="height: 38px" 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-space>
+                        <a-button type="primary">
+                            <template #icon>
+                                <icon-plus />
+                            </template>
+                            {{ $t('searchTable.operation.create') }}
+                        </a-button>
+                    </a-space>
+                </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[])" :data="renderData" :bordered="{ headerCell: true }"
+                :size="size" @page-change="onPageChange">
+                <template #index="{ record }">
+                    {{ record.id }}
+                </template>
+                <template #name="{ record }">
+                    <div>{{ record.name }}</div>
+                    <a-typography-paragraph :ellipsis="{ rows: 2 }">
+                        <a-typography-text disabled>
+                            {{ record.description }}
+                        </a-typography-text>
+                    </a-typography-paragraph>
+                </template>
+
+                <template #company="{ record }">
+                    <div>{{ record.company }}</div>
+                    <a-typography-text disabled>
+                        {{ record.mobile }}
+                    </a-typography-text>
+                </template>
+
+                <template #balance="{ record }">
+                    <a-tag color="gray">{{ record.balance }} </a-tag>
+                </template>
+
+                <template #status="{ record }">
+                    <a-tag v-if="record.status" bordered color="green">
+                        <template #icon>
+                            <icon-check />
+                        </template>
+                        正常
+                    </a-tag>
+                    <a-tag v-else bordered color="">
+                        <template #icon>
+                            <icon-stop />
+                        </template>
+                        禁用
+                    </a-tag>
+                </template>
+                <template #time="{ record }">
+                    <div style="color:gray;">
+                        <div>添加：{{ dayjs(record.create_time).format('MM-DD HH:mm') }}</div>
+                        <div>更新：{{ dayjs(record.last_time).format('MM-DD HH:mm') }}</div>
+                    </div>
+                </template>
+            </a-table>
+        </a-card>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { useRouter } from 'vue-router';
+import { computed, ref, reactive, watch, nextTick } from 'vue';
+import { useI18n } from 'vue-i18n';
+import dayjs from 'dayjs';
+import useLoading from '@/hooks/loading';
+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';
+import Sortable from 'sortablejs';
+import { numberFormat, amountFormat } from '@/utils/util';
+import WorkHourModel from '@/components/WorkHourModel.vue';
+
+import {
+    AliyunAccountParams, AliyunAccountRecord, queryAccountList
+} from '@/api/aliyun';
+
+
+type SizeProps = 'mini' | 'small' | 'medium' | 'large';
+type Column = TableColumnData & { checked?: true };
+
+
+const generateFormModel = () => {
+    return {
+        name: '',
+        lastTime: [],
+        status: '',
+        sort: 'status',
+        order: 'descending',
+    };
+};
+const router = useRouter();
+
+const { loading, setLoading } = useLoading(true);
+const { t } = useI18n();
+const renderData = ref<AliyunAccountRecord[]>([]);
+const formModel = ref(generateFormModel());
+const cloneColumns = ref<Column[]>([]);
+const showColumns = ref<Column[]>([]);
+
+const size = ref<SizeProps>('small');
+
+const basePagination: Pagination = {
+    current: 1,
+    pageSize: 50,
+};
+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: 'index',
+        slotName: 'index',
+        width: 50,
+    },
+    {
+        title: '账号名',
+        slotName: 'name',
+        width: 250,
+    },
+    {
+        title: '认证主体',
+        slotName: 'company',
+        width: 250,
+    },
+    {
+        title: '账户余额',
+        slotName: 'balance',
+        align: 'right',
+        width: 120,
+    },
+    {
+        title: '状态',
+        slotName: 'status',
+        width: 100,
+    },
+    {
+        title: '时间',
+        slotName: 'time',
+        width: 170,
+    },
+]);
+
+const statusOptions = computed<SelectOptionData[]>(() => [
+    {
+        label: '全部',
+        value: '',
+    },
+    {
+        label: '正常',
+        value: '1',
+    },
+    {
+        label: '禁用',
+        value: '0',
+    },
+]);
+
+const fetchData = async (
+    params: AliyunAccountParams = {
+        current: 1,
+        pageSize: 50,
+        sort: 'status',
+        order: 'descending',
+        getTotal: true,
+    }
+) => {
+    setLoading(true);
+    try {
+        const { data } = await queryAccountList(params);
+        if (!data) return;
+        renderData.value = data.list;
+        pagination.current = data.page;
+        pagination.total = data.count;
+    } catch (err) {
+        console.log(err);
+    } finally {
+        setLoading(false);
+    }
+};
+
+
+
+
+const search = () => {
+    fetchData({
+        ...basePagination,
+        ...formModel.value,
+    } as unknown as AliyunAccountParams);
+};
+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/settings/config.vue

@@ -19,13 +19,6 @@
                                     </a-form-item>
 
 
-                                    <a-form-item field="fake_click_min" label="补点击次数" :rules="[{ required: true }]">
-                                        <a-input-number v-model="formData.fake_click_min" :min="0" /> -
-                                        <a-input-number v-model="formData.fake_click_max" :min="0" />
-                                    </a-form-item>
-
-
-
                                     <a-form-item field="fake_click_min" label="补点击次数" :rules="[{ required: true }]">
                                         <a-input-number v-model="formData.fake_click_min" :min="0" /> -
                                         <a-input-number v-model="formData.fake_click_max" :min="0" />
@@ -37,7 +30,6 @@
                                     </a-form-item>
 
 
-
                                     <a-form-item field="blacklist_oaid" label="OAID黑名单">
                                         <a-textarea v-model="formData.blacklist_oaid" placeholder="OAID黑名单"
                                             :auto-size="{ minRows: 5, maxRows: 20 }" />