From 13d294e238f0e0c603f7454912c6ad2765050e54 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=91=E6=96=87=E5=8F=AF?= <1041367524@qq.com>
Date: Wed, 13 Apr 2022 19:32:57 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=A7=92=E6=9D=80=E6=B4=BB=E5=8A=A8?=
 =?UTF-8?q?=E9=9D=99=E6=80=81=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 jsconfig.json                                 |   3 +-
 src/plugins/global-api.js                     |  12 +-
 src/router/index.js                           |   1 +
 src/router/modules/operation.js               |  45 ++++
 .../modules/operation/limit/limitActivity.js  |  96 ++++++++
 .../modules/operation/limit/limitProduct.js   |  93 ++++++++
 .../modules/operation/limit/limitTime.js      |  96 ++++++++
 src/views/operation/limit/index.vue           | 209 ++++++++++++++++++
 src/views/operation/limit/product.vue         | 195 ++++++++++++++++
 src/views/operation/limit/time.vue            | 150 +++++++++++++
 vite.config.js                                |   5 +-
 11 files changed, 901 insertions(+), 4 deletions(-)
 create mode 100644 src/router/modules/operation.js
 create mode 100644 src/store/modules/operation/limit/limitActivity.js
 create mode 100644 src/store/modules/operation/limit/limitProduct.js
 create mode 100644 src/store/modules/operation/limit/limitTime.js
 create mode 100644 src/views/operation/limit/index.vue
 create mode 100644 src/views/operation/limit/product.vue
 create mode 100644 src/views/operation/limit/time.vue

diff --git a/jsconfig.json b/jsconfig.json
index 079a150..6386598 100644
--- a/jsconfig.json
+++ b/jsconfig.json
@@ -7,7 +7,8 @@
         "baseUrl": "./",
         "paths": {
             "@/*": ["src/*"]
-        }
+        },
+        "jsx": "preserve"
     },
     "exclude": ["node_modules"]
 }
diff --git a/src/plugins/global-api.js b/src/plugins/global-api.js
index 1fecb3d..dcbeffe 100644
--- a/src/plugins/global-api.js
+++ b/src/plugins/global-api.js
@@ -72,8 +72,18 @@ export const excel = (fileName, data) => {
  * @returns 字典标签
  */
 export const dict = (dict, value, opts = {}) => {
+    value = value || [];
+    value = value instanceof Array ? value : [value];
     opts = { label: 'label', value: 'value', default: '未知', ...opts };
-    return (dict ? dict.value || dict : []).find((item) => item[opts.value] === value)?.[opts.label] || opts.default;
+    return (
+        value
+            .map(
+                (v) =>
+                    (dict ? dict.value || dict : []).find((item) => item[opts.value] === v)?.[opts.label] ||
+                    opts.default
+            )
+            .join(',') || opts.default
+    );
 };
 /**
  * 显示姓名
diff --git a/src/router/index.js b/src/router/index.js
index 40a8c9e..9ef5fde 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -130,6 +130,7 @@ const flatRoutes = (routes, parent = { path: '/', meta: {} }) =>
             }
             route.path = parent.path + route.path;
         }
+        route.meta = route.meta || {};
         route.meta.menu = route.path.replaceAll(/\/:[^?]+\?/g, '');
         let activeMenu = route.meta.activeMenu;
         if (!activeMenu && route.meta.hidden) {
diff --git a/src/router/modules/operation.js b/src/router/modules/operation.js
new file mode 100644
index 0000000..68be07d
--- /dev/null
+++ b/src/router/modules/operation.js
@@ -0,0 +1,45 @@
+export default [
+    {
+        path: '/operation',
+        name: 'OperationCenter',
+        component: () => import('@/layouts/default.vue'),
+        meta: {
+            title: '运营中心',
+            icon: 'computer-fill',
+            layout: true,
+        },
+        children: [
+            {
+                path: 'limit',
+                name: 'LimitActivity',
+                component: () => import('@/views/operation/limit/index.vue'),
+                meta: {
+                    title: '秒杀活动',
+                    icon: 'fire-fill',
+                },
+                children: [
+                    {
+                        path: 'time/:id',
+                        name: 'UpdateLimitTime',
+                        component: () => import('@/views/operation/limit/time.vue'),
+                        meta: {
+                            title: '设置时段',
+                            icon: 'fire-fill',
+                            hidden: true,
+                        },
+                    },
+                    {
+                        path: 'product/:id',
+                        name: 'UpdateLimitProduct',
+                        component: () => import('@/views/operation/limit/product.vue'),
+                        meta: {
+                            title: '设置商品',
+                            icon: 'fire-fill',
+                            hidden: true,
+                        },
+                    },
+                ],
+            },
+        ],
+    },
+];
diff --git a/src/store/modules/operation/limit/limitActivity.js b/src/store/modules/operation/limit/limitActivity.js
new file mode 100644
index 0000000..4939aaf
--- /dev/null
+++ b/src/store/modules/operation/limit/limitActivity.js
@@ -0,0 +1,96 @@
+import * as api from '@/api/sales/category.js';
+import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
+const state = () => ({
+    code: 'LimitActivity',
+    condition: {},
+    list: [],
+    total: 0,
+    summary: [],
+    opts: {
+        init: false,
+        status: [
+            { label: '活动未开始', value: 1 },
+            { label: '活动进行中', value: 2 },
+            { label: '活动已结束', value: 3 },
+        ],
+    },
+});
+const getters = {};
+const mutations = {
+    setCode: (state, data) => (state.code = data),
+    setCondition: (state, data) => (state.condition = data),
+    setList: (state, data) => (state.list = data),
+    setTotal: (state, data) => (state.total = data),
+    setSummary: (state, data) => (state.summary = data),
+    setOpts: (state, data) => (state.opts = data),
+};
+const actions = {
+    search: async ({ state, commit }) => {
+        let res = await api.search(state.condition);
+        commit('setList', res);
+        if (!res) {
+            ElMessage.error('查询商品分类列表失败');
+        }
+        return res;
+    },
+    load: async ({ commit, state }) => {
+        commit('setOpts', {
+            ...state.opts,
+            init: true,
+        });
+    },
+    detail: async ({ state, dispatch }, id) => {
+        if (!state.list.length) {
+            await dispatch('search');
+        }
+        let res = state.list.find((item) => item.id === id);
+        if (!res) {
+            ElMessage.error('加载详情失败');
+        }
+        return res;
+    },
+    save: async ({ dispatch }, data) => {
+        let save = data.id ? api.update : api.create;
+        let res = await save(data);
+        if (res) {
+            ElMessage.success('保存成功');
+            dispatch('search');
+        } else {
+            ElMessage.error('保存失败');
+        }
+        return res;
+    },
+    sort: async (context, data) => {
+        let res = await api.sort(data);
+        if (res) {
+            ElMessage.success(`移动前序号：${data.oldSort + 1}；移动后序号：${data.currentSort + 1}`);
+        } else {
+            ElMessage.error('保存排序失败');
+        }
+        return res;
+    },
+    remove: async ({ dispatch }, ids) => {
+        if (!ids.length) {
+            ElMessage.warning('请选择要删除的数据');
+        } else {
+            try {
+                await ElMessageBox.confirm('数据删除后无法恢复，确定要删除吗?', '危险操作');
+                let res = await api.remove({ id: ids.join(',') });
+                if (res) {
+                    ElMessage.success('删除成功');
+                    dispatch('search');
+                } else {
+                    ElMessage.error('删除失败');
+                }
+            } catch (e) {
+                console.info('取消删除', e);
+            }
+        }
+    },
+};
+export default {
+    state,
+    getters,
+    mutations,
+    actions,
+};
diff --git a/src/store/modules/operation/limit/limitProduct.js b/src/store/modules/operation/limit/limitProduct.js
new file mode 100644
index 0000000..f73c67d
--- /dev/null
+++ b/src/store/modules/operation/limit/limitProduct.js
@@ -0,0 +1,93 @@
+import * as api from '@/api/sales/category.js';
+import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
+const state = () => ({
+    code: 'LimitActivity',
+    condition: {},
+    list: [],
+    total: 0,
+    summary: [],
+    opts: {
+        init: false,
+        timeRange: [],
+        category: [],
+    },
+});
+const getters = {};
+const mutations = {
+    setCode: (state, data) => (state.code = data),
+    setCondition: (state, data) => (state.condition = data),
+    setList: (state, data) => (state.list = data),
+    setTotal: (state, data) => (state.total = data),
+    setSummary: (state, data) => (state.summary = data),
+    setOpts: (state, data) => (state.opts = data),
+};
+const actions = {
+    search: async ({ state, commit }) => {
+        let res = await api.search(state.condition);
+        commit('setList', res);
+        if (!res) {
+            ElMessage.error('查询商品分类列表失败');
+        }
+        return res;
+    },
+    load: async ({ commit, state }) => {
+        commit('setOpts', {
+            ...state.opts,
+            init: true,
+        });
+    },
+    detail: async ({ state, dispatch }, id) => {
+        if (!state.list.length) {
+            await dispatch('search');
+        }
+        let res = state.list.find((item) => item.id === id);
+        if (!res) {
+            ElMessage.error('加载详情失败');
+        }
+        return res;
+    },
+    save: async ({ dispatch }, data) => {
+        let save = data.id ? api.update : api.create;
+        let res = await save(data);
+        if (res) {
+            ElMessage.success('保存成功');
+            dispatch('search');
+        } else {
+            ElMessage.error('保存失败');
+        }
+        return res;
+    },
+    sort: async (context, data) => {
+        let res = await api.sort(data);
+        if (res) {
+            ElMessage.success(`移动前序号：${data.oldSort + 1}；移动后序号：${data.currentSort + 1}`);
+        } else {
+            ElMessage.error('保存排序失败');
+        }
+        return res;
+    },
+    remove: async ({ dispatch }, ids) => {
+        if (!ids.length) {
+            ElMessage.warning('请选择要删除的数据');
+        } else {
+            try {
+                await ElMessageBox.confirm('数据删除后无法恢复，确定要删除吗?', '危险操作');
+                let res = await api.remove({ id: ids.join(',') });
+                if (res) {
+                    ElMessage.success('删除成功');
+                    dispatch('search');
+                } else {
+                    ElMessage.error('删除失败');
+                }
+            } catch (e) {
+                console.info('取消删除', e);
+            }
+        }
+    },
+};
+export default {
+    state,
+    getters,
+    mutations,
+    actions,
+};
diff --git a/src/store/modules/operation/limit/limitTime.js b/src/store/modules/operation/limit/limitTime.js
new file mode 100644
index 0000000..8503473
--- /dev/null
+++ b/src/store/modules/operation/limit/limitTime.js
@@ -0,0 +1,96 @@
+import * as api from '@/api/sales/category.js';
+import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
+const state = () => ({
+    code: 'LimitTime',
+    condition: {},
+    list: [],
+    total: 0,
+    summary: [],
+    opts: {
+        init: false,
+        status: [
+            { label: '活动未开始', value: 1 },
+            { label: '活动进行中', value: 2 },
+            { label: '活动已结束', value: 3 },
+        ],
+    },
+});
+const getters = {};
+const mutations = {
+    setCode: (state, data) => (state.code = data),
+    setCondition: (state, data) => (state.condition = data),
+    setList: (state, data) => (state.list = data),
+    setTotal: (state, data) => (state.total = data),
+    setSummary: (state, data) => (state.summary = data),
+    setOpts: (state, data) => (state.opts = data),
+};
+const actions = {
+    search: async ({ state, commit }) => {
+        let res = await api.search(state.condition);
+        commit('setList', res);
+        if (!res) {
+            ElMessage.error('查询商品分类列表失败');
+        }
+        return res;
+    },
+    load: async ({ commit, state }) => {
+        commit('setOpts', {
+            ...state.opts,
+            init: true,
+        });
+    },
+    detail: async ({ state, dispatch }, id) => {
+        if (!state.list.length) {
+            await dispatch('search');
+        }
+        let res = state.list.find((item) => item.id === id);
+        if (!res) {
+            ElMessage.error('加载详情失败');
+        }
+        return res;
+    },
+    save: async ({ dispatch }, data) => {
+        let save = data.id ? api.update : api.create;
+        let res = await save(data);
+        if (res) {
+            ElMessage.success('保存成功');
+            dispatch('search');
+        } else {
+            ElMessage.error('保存失败');
+        }
+        return res;
+    },
+    sort: async (context, data) => {
+        let res = await api.sort(data);
+        if (res) {
+            ElMessage.success(`移动前序号：${data.oldSort + 1}；移动后序号：${data.currentSort + 1}`);
+        } else {
+            ElMessage.error('保存排序失败');
+        }
+        return res;
+    },
+    remove: async ({ dispatch }, ids) => {
+        if (!ids.length) {
+            ElMessage.warning('请选择要删除的数据');
+        } else {
+            try {
+                await ElMessageBox.confirm('数据删除后无法恢复，确定要删除吗?', '危险操作');
+                let res = await api.remove({ id: ids.join(',') });
+                if (res) {
+                    ElMessage.success('删除成功');
+                    dispatch('search');
+                } else {
+                    ElMessage.error('删除失败');
+                }
+            } catch (e) {
+                console.info('取消删除', e);
+            }
+        }
+    },
+};
+export default {
+    state,
+    getters,
+    mutations,
+    actions,
+};
diff --git a/src/views/operation/limit/index.vue b/src/views/operation/limit/index.vue
new file mode 100644
index 0000000..b5294c1
--- /dev/null
+++ b/src/views/operation/limit/index.vue
@@ -0,0 +1,209 @@
+<template>
+    <div class="list-container">
+        <TableList
+            v-loading="loading"
+            :code="code"
+            :config="config"
+            :data="list"
+            :operation="['search', 'create']"
+            :reset="handleReset"
+            title="活动"
+            :total="total"
+            @create="handleCreate"
+            @search="handleSearch"
+        >
+            <template #search>
+                <el-form inline>
+                    <el-form-item label="活动名称" prop="name">
+                        <el-input v-model="state.condition.name" />
+                    </el-form-item>
+                    <el-form-item label="活动状态" prop="status">
+                        <el-select v-model="state.condition.status" :opts="opts.status" />
+                    </el-form-item>
+                </el-form>
+            </template>
+        </TableList>
+        <el-dialog v-model="formState.formVisible" :title="formState.form.id ? '编辑' : '添加' + '活动'">
+            <el-form ref="refsForm" label-width="100px" :model="formState.form" :rules="formState.rules">
+                <el-form-item label="活动名称" prop="name">
+                    <el-input v-model="formState.form.name" />
+                </el-form-item>
+                <el-form-item label="活动名称" prop="time">
+                    <el-date-picker
+                        v-model="formState.form.time"
+                        type="datetimerange"
+                        value-format="YYYY-MM-DD HH:mm:ss"
+                    />
+                </el-form-item>
+            </el-form>
+            <template #footer>
+                <el-button @click="formState.formVisible = false">取消</el-button>
+                <el-button type="primary" @click="handleSave">保存</el-button>
+            </template>
+        </el-dialog>
+    </div>
+</template>
+
+<script setup lang="jsx">
+    import ElButton from '@/components/extra/ElButton.vue';
+    import ElSwitch from '@/components/extra/ElSwitch.vue';
+    const { proxy } = getCurrentInstance();
+    const router = useRouter();
+    const store = useStore();
+    const loading = ref(false);
+    const code = computed(() => store.state.limitActivity.code);
+    const list = computed(() => store.state.limitActivity.list);
+    const total = computed(() => store.state.limitActivity.total);
+    const opts = computed(() => store.state.limitActivity.opts);
+    if (!unref(opts).init) {
+        store.dispatch('limitActivity/load');
+    }
+
+    /* 列表查询 */
+    const state = reactive({
+        condition: {
+            name: null,
+            status: null,
+        },
+    });
+    watch(
+        () => state.condition,
+        (value) => {
+            store.commit('limitActivity/setCondition', _.cloneDeep(value));
+        },
+        { immediate: true, deep: true }
+    );
+    const handleReset = () => {
+        state.condition = {
+            name: null,
+            status: null,
+        };
+    };
+    const handleSearch = async () => {
+        loading.value = true;
+        await store.dispatch('limitActivity/search');
+        loading.value = false;
+    };
+
+    /* 表单 */
+    const formState = reactive({
+        formVisible: false,
+        refsForm: null,
+        form: {
+            name: null,
+            time: [],
+        },
+        rules: {
+            name: [{ required: true, message: '活动名称不能为空' }],
+            time: [{ required: true, message: '活动时间不能为空' }],
+        },
+    });
+    // 添加/编辑
+    const handleCreate = (row) => {
+        Object.assign(
+            formState.form,
+            row || {
+                name: null,
+                time: [],
+            }
+        );
+        formState.formVisible.value = true;
+    };
+    // 保存
+    const handleSave = async () => {
+        try {
+            await unref(formState.refsForm).validate();
+            formState.formVisible = false;
+        } catch (e) {
+            console.info('取消保存', e);
+        }
+    };
+
+    /* 操作 */
+    // 设置时段
+    const handleUpdateTime = (row) => {
+        router.push({ name: 'UpdateLimitTime', params: { id: row.id } });
+    };
+    // 设置商品
+    const handleUpdateProduct = (row) => {
+        router.push({ name: 'UpdateLimitProduct', params: { id: row.id } });
+    };
+    // 上下架
+    const handleEnable = (row, value) => {
+        row.enabled = value;
+    };
+    // 删除
+    const handleRemove = async (rows) => {
+        await store.dispatch(
+            'limitActivity/remove',
+            rows.map((item) => item.id)
+        );
+    };
+
+    /* 列表配置 */
+    const config = reactive({
+        page: false,
+        columns: [
+            {
+                label: '编号',
+                prop: 'id',
+                width: 100,
+                fixed: 'left',
+            },
+            {
+                label: '活动名称',
+                prop: 'name',
+                minWidth: 160,
+                fixed: 'left',
+            },
+            {
+                label: '活动状态',
+                width: 160,
+                slots: {
+                    default: ({ row }) => proxy.$dict(unref(opts).status, row.status),
+                },
+            },
+            {
+                label: '活动时间',
+                width: 360,
+                slots: {
+                    default: ({ row }) => row.startTime + ' - ' + row.endTime,
+                },
+            },
+            {
+                label: '上线/下线',
+                width: 120,
+                slots: {
+                    default: ({ row }) => (
+                        <ElSwitch value={row.isEnable} onChange={(visible) => handleEnable(row, visible)} />
+                    ),
+                },
+            },
+            {
+                label: '操作',
+                fixed: 'right',
+                width: 300,
+                slots: {
+                    default: ({ row }) => (
+                        <div>
+                            <ElButton type="text" onClick={() => handleUpdateTime(row)}>
+                                设置时段
+                            </ElButton>
+                            <ElButton type="text" onClick={() => handleUpdateProduct(row)}>
+                                设置商品
+                            </ElButton>
+                            <ElButton type="text" onClick={() => handleCreate(row)}>
+                                编辑
+                            </ElButton>
+                            <ElButton type="text" onClick={() => handleRemove([row])}>
+                                删除
+                            </ElButton>
+                        </div>
+                    ),
+                },
+            },
+        ],
+    });
+</script>
+
+<style lang="less" scoped></style>
diff --git a/src/views/operation/limit/product.vue b/src/views/operation/limit/product.vue
new file mode 100644
index 0000000..db608de
--- /dev/null
+++ b/src/views/operation/limit/product.vue
@@ -0,0 +1,195 @@
+<template>
+    <div class="list-container">
+        <ul class="time-range">
+            <li v-for="(item, index) in opts.timeRange" :key="index">
+                <el-button
+                    :type="state.condition.orderStatus.includes(item.value) ? 'primary' : 'default'"
+                    @click="handleTimeRange(item.value)"
+                >
+                    <span>
+                        {{ item.label }}
+                    </span>
+                    <span>(</span>
+                    <span class="num">{{ summary[index] || 0 }}</span>
+                    <span>)</span>
+                </el-button>
+            </li>
+        </ul>
+        <TableList
+            v-loading="loading"
+            :code="code"
+            :config="config"
+            :data="list"
+            :operation="['search', 'create']"
+            :reset="handleReset"
+            title="活动商品"
+            :total="total"
+            @create="handleCreate"
+            @search="handleSearch"
+        >
+            <template #search>
+                <el-form inline>
+                    <el-form-item label="商品名称" prop="name">
+                        <el-input v-model="state.condition.name" />
+                    </el-form-item>
+                    <el-form-item label="商品分类" prop="category">
+                        <el-select v-model="state.condition.category" :opts="opts.category" />
+                    </el-form-item>
+                </el-form>
+            </template>
+        </TableList>
+    </div>
+</template>
+
+<script setup lang="jsx">
+    import ElButton from '@/components/extra/ElButton.vue';
+    const store = useStore();
+    const loading = ref(false);
+    const code = computed(() => store.state.limitProduct.code);
+    const list = computed(() => store.state.limitProduct.list);
+    const total = computed(() => store.state.limitProduct.total);
+    const summary = computed(() => store.state.limitProduct.summary);
+    const opts = computed(() => store.state.limitProduct.opts);
+    if (!unref(opts).init) {
+        store.dispatch('limitProduct/load');
+    }
+
+    /* 查询订单 */
+    const state = reactive({
+        condition: {
+            name: null,
+            category: null,
+        },
+    });
+    watch(
+        () => state.condition,
+        (value) => {
+            store.commit('limitProduct/setCondition', _.cloneDeep(value));
+        },
+        { immediate: true, deep: true }
+    );
+    watch(
+        () => state.condition.orderStatus,
+        () => {
+            handleSearch();
+        },
+        { deep: true }
+    );
+    const handleReset = () => {
+        state.condition = {
+            name: null,
+            category: null,
+        };
+    };
+    const handleTimeRange = (status) => {
+        let index = state.condition.orderStatus.indexOf(status);
+        if (index === -1) {
+            if (status === 0) {
+                state.condition.orderStatus = [0];
+            } else {
+                state.condition.orderStatus.push(status);
+                state.condition.orderStatus = state.condition.orderStatus.filter((item) => item > 0);
+            }
+        } else {
+            if (status !== 0) {
+                state.condition.orderStatus.splice(index, 1);
+                if (state.condition.orderStatus.length) {
+                    state.condition.orderStatus = state.condition.orderStatus.filter((item) => item > 0);
+                } else {
+                    state.condition.orderStatus = [0];
+                }
+            }
+        }
+    };
+    const handleSearch = async () => {
+        loading.value = true;
+        await store.dispatch('limitProduct/search');
+        loading.value = false;
+    };
+
+    /* 导出订单 */
+    const handleCreate = async () => {
+        console.info('create');
+    };
+    const handleRemove = (row, index) => {
+        console.info(row, index);
+    };
+    const handleSku = (row) => {
+        console.info(row);
+    };
+
+    /* 列表配置 */
+    const config = reactive({
+        columns: [
+            {
+                label: '编号',
+                prop: 'orderNo',
+                minWidth: 100,
+            },
+            {
+                label: '商品图片',
+                width: 100,
+                slots: {
+                    default: ({ row }) => <ElImage src={row.photo} alt={row.name} height="100px" />,
+                },
+            },
+            {
+                label: '商品名称',
+                prop: 'payAmount',
+                minWidth: 240,
+            },
+            {
+                label: '商品价格',
+                prop: 'payTypeDesc',
+                width: 120,
+            },
+            {
+                label: '活动已售数量',
+                width: 120,
+                prop: 'orderSourceDesc',
+            },
+            {
+                label: 'SKU商品配置',
+                width: 120,
+                slots: {
+                    default: ({ row }) => (
+                        <ElButton type="text" onClick={() => handleSku(row)}>
+                            <ElIcon name="Edit" />
+                        </ElButton>
+                    ),
+                },
+            },
+            {
+                label: '操作',
+                fixed: 'right',
+                width: 160,
+                slots: {
+                    default: ({ row, $index }) => (
+                        <ElButton type="text" onClick={() => handleRemove(row, $index)}>
+                            移除
+                        </ElButton>
+                    ),
+                },
+            },
+        ],
+    });
+</script>
+
+<style lang="less" scoped>
+    .list-container {
+        display: flex;
+        flex-direction: column;
+        .common-list {
+            flex-shrink: 1;
+        }
+        .time-range {
+            display: flex;
+            margin-bottom: @layout-space;
+            li {
+                + li {
+                    margin-left: @layout-space;
+                }
+            }
+        }
+    }
+</style>
diff --git a/src/views/operation/limit/time.vue b/src/views/operation/limit/time.vue
new file mode 100644
index 0000000..197a3e3
--- /dev/null
+++ b/src/views/operation/limit/time.vue
@@ -0,0 +1,150 @@
+<template>
+    <div class="list-container">
+        <TableList
+            v-loading="loading"
+            :code="code"
+            :config="config"
+            :data="list"
+            :operation="['create']"
+            :reset="handleReset"
+            title="时间段"
+            :total="total"
+            @create="handleCreate"
+            @search="handleSearch"
+        >
+            <template #operation>
+                <el-button type="success" @click="handleProduct">下一步，设置秒杀商品</el-button>
+            </template>
+        </TableList>
+    </div>
+</template>
+
+<script setup lang="jsx">
+    import ElButton from '@/components/extra/ElButton.vue';
+    import ElSwitch from '@/components/extra/ElSwitch.vue';
+    const route = useRoute();
+    const router = useRouter();
+    const store = useStore();
+    const loading = ref(false);
+    const code = computed(() => store.state.limitTime.code);
+    const list = computed(() => _.cloneDeep(store.state.limitTime.list));
+    const total = computed(() => store.state.limitTime.total);
+    const opts = computed(() => store.state.limitTime.opts);
+    if (!unref(opts).init) {
+        store.dispatch('limitTime/load');
+    }
+
+    /* 列表查询 */
+    const state = reactive({
+        condition: {
+            name: null,
+            status: null,
+        },
+    });
+    watch(
+        () => state.condition,
+        (value) => {
+            store.commit('limitTime/setCondition', _.cloneDeep(value));
+        },
+        { immediate: true, deep: true }
+    );
+    const handleReset = () => {
+        state.condition = {
+            name: null,
+            status: null,
+        };
+    };
+    const handleSearch = async () => {
+        loading.value = true;
+        await store.dispatch('limitTime/search');
+        loading.value = false;
+    };
+
+    /* 操作 */
+    // 新增
+    const handleCreate = () => {
+        store.commit('limitTime/setList', [
+            ...unref(list),
+            { edit: true, name: null, startTime: null, endTime: null, enabled: true },
+        ]);
+    };
+    // 设置商品
+    const handleProduct = () => {
+        router.push({ name: 'UpdateLimitProduct', params: { id: route.params.id } });
+    };
+    // 启用
+    const handleEnable = (row, value) => {
+        row.enabled = value;
+    };
+    // 编辑
+    const handleUpdate = (row) => {
+        row.edit = !row.edit;
+    };
+    // 删除
+    const handleRemove = async (rows) => {
+        await store.dispatch(
+            'limitTime/remove',
+            rows.map((item) => item.id)
+        );
+    };
+
+    /* 列表配置 */
+    const config = reactive({
+        page: false,
+        columns: [
+            {
+                label: '秒杀时段名称',
+                minWidth: 160,
+                slots: {
+                    default: ({ row }) => (row.edit ? <ElInput v-model={row.name} /> : row.name),
+                },
+            },
+            {
+                label: '开始时间',
+                width: 160,
+                slots: {
+                    default: ({ row }) => (row.edit ? <ElTimePicker v-model={row.startTime} /> : row.startTime),
+                },
+            },
+            {
+                label: '活动状态',
+                width: 160,
+                slots: {
+                    default: ({ row }) => (row.edit ? <ElTimePicker v-model={row.endTime} /> : row.endTime),
+                },
+            },
+            {
+                label: '启用',
+                width: 100,
+                slots: {
+                    default: ({ row }) => (
+                        <ElSwitch value={row.enabled} onChange={(enabled) => handleEnable(row, enabled)} />
+                    ),
+                },
+            },
+            {
+                label: '操作',
+                fixed: 'right',
+                width: 120,
+                slots: {
+                    default: ({ row }) => (
+                        <div>
+                            <ElButton type="text" onClick={() => handleUpdate(row)}>
+                                {row.edit ? '保存' : '编辑'}
+                            </ElButton>
+                            <ElButton type="text" onClick={() => handleRemove([row])}>
+                                删除
+                            </ElButton>
+                        </div>
+                    ),
+                },
+            },
+        ],
+    });
+</script>
+
+<style lang="less" scoped>
+    :deep(.el-date-editor--time) {
+        width: 100%;
+    }
+</style>
diff --git a/vite.config.js b/vite.config.js
index 5656347..fa34567 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -20,8 +20,9 @@ export default (configEnv) => {
             open: false,
             proxy: {
                 '/api': {
-                    target: 'http://192.168.10.52:8090/',
-                    // target: 'https://gateway-test.mashibing.cn', // 测试地址
+                    // target: 'http://192.168.10.52:8090/', // 显雨
+                    // target: 'http://192.168.10.252:8090', // 高玉
+                    target: 'http://k8s-horse-gateway.mashibing.cn/', // 测试地址
                     // target: 'https://gateway.mashibing.cn', // 预发地址
                     // target: 'https://gateway.mashibing.com', // 生产环境
                     changeOrigin: true,