From 5067f424788866b48e6b155231d7a8df4fd961fe Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=91=E6=96=87=E5=8F=AF?= <1041367524@qq.com>
Date: Mon, 18 Apr 2022 15:25:07 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=8E=A8=E8=8D=90=E5=95=86=E5=93=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/operation/limit/limitProduct.js       |  22 ++
 .../operation/recommend/recommendProduct.js   |  29 +++
 src/router/modules/operation.js               |   4 +-
 .../modules/operation/limit/limitProduct.js   |  44 ++--
 .../recommendProduct.js}                      |  39 ++--
 src/views/operation/limit/product.vue         | 112 +++++-----
 src/views/operation/recommand/product.vue     | 195 ------------------
 src/views/operation/recommand/time.vue        | 150 --------------
 .../{recommand => recommend}/index.vue        |  33 +--
 src/views/sales/product/index.vue             |   4 +-
 10 files changed, 149 insertions(+), 483 deletions(-)
 create mode 100644 src/api/operation/limit/limitProduct.js
 create mode 100644 src/api/operation/recommend/recommendProduct.js
 rename src/store/modules/operation/{recommand/recommandActivity.js => recommend/recommendProduct.js} (69%)
 delete mode 100644 src/views/operation/recommand/product.vue
 delete mode 100644 src/views/operation/recommand/time.vue
 rename src/views/operation/{recommand => recommend}/index.vue (78%)

diff --git a/src/api/operation/limit/limitProduct.js b/src/api/operation/limit/limitProduct.js
new file mode 100644
index 0000000..0c47d54
--- /dev/null
+++ b/src/api/operation/limit/limitProduct.js
@@ -0,0 +1,22 @@
+import request from '@/utils/request.js';
+export const search = (params) => {
+    return request({
+        url: '/mall/marketing/activityProduct',
+        method: 'get',
+        params,
+    });
+};
+export const create = (data) => {
+    return request({
+        url: '/mall/marketing/activityProduct',
+        method: 'post',
+        data,
+    });
+};
+export const remove = (idList) => {
+    return request({
+        url: '/mall/marketing/activityProduct',
+        method: 'delete',
+        params: { idList },
+    });
+};
diff --git a/src/api/operation/recommend/recommendProduct.js b/src/api/operation/recommend/recommendProduct.js
new file mode 100644
index 0000000..85b07ee
--- /dev/null
+++ b/src/api/operation/recommend/recommendProduct.js
@@ -0,0 +1,29 @@
+import request from '@/utils/request.js';
+export const search = (params) => {
+    return request({
+        url: '/mall/marketing/productRecommended',
+        method: 'get',
+        params,
+    });
+};
+export const create = (data) => {
+    return request({
+        url: '/mall/marketing/productRecommended',
+        method: 'post',
+        data,
+    });
+};
+export const enable = (data) => {
+    return request({
+        url: '/mall/marketing/productRecommended',
+        method: 'put',
+        data,
+    });
+};
+export const remove = (idList) => {
+    return request({
+        url: '/mall/marketing/productRecommended',
+        method: 'delete',
+        params: { idList },
+    });
+};
diff --git a/src/router/modules/operation.js b/src/router/modules/operation.js
index cc62a12..7aea860 100644
--- a/src/router/modules/operation.js
+++ b/src/router/modules/operation.js
@@ -41,9 +41,9 @@ export default [
                 ],
             },
             {
-                path: 'recommand',
+                path: 'recommend',
                 name: 'RecommandActivity',
-                component: () => import('@/views/operation/recommand/index.vue'),
+                component: () => import('@/views/operation/recommend/index.vue'),
                 meta: {
                     title: '商品推荐',
                     icon: 'Checked',
diff --git a/src/store/modules/operation/limit/limitProduct.js b/src/store/modules/operation/limit/limitProduct.js
index f73c67d..96d957d 100644
--- a/src/store/modules/operation/limit/limitProduct.js
+++ b/src/store/modules/operation/limit/limitProduct.js
@@ -1,11 +1,11 @@
-import * as api from '@/api/sales/category.js';
+import * as api from '@/api/operation/limit/limitProduct.js';
+import * as limitTimeAPI from '@/api/operation/limit/limitTime.js';
 import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
 const state = () => ({
-    code: 'LimitActivity',
+    code: 'LimitProduct',
     condition: {},
     list: [],
     total: 0,
-    summary: [],
     opts: {
         init: false,
         timeRange: [],
@@ -18,37 +18,28 @@ const mutations = {
     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);
+    search: async ({ state, commit, rootGetters }) => {
+        let data = { ...state.condition };
+        let res = await api.search({ ...rootGetters['local/page'](state.code), ...data });
+        commit('setList', res?.records || []);
+        commit('setTotal', res?.total || 0);
         if (!res) {
-            ElMessage.error('查询商品分类列表失败');
+            ElMessage.error('查询秒杀商品列表失败');
         }
         return res;
     },
-    load: async ({ commit, state }) => {
+    load: async ({ commit, state }, activityId) => {
         commit('setOpts', {
             ...state.opts,
             init: true,
+            timeRange: await limitTimeAPI.search({ activityId }),
         });
     },
-    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);
+        let res = await api.create(data);
         if (res) {
             ElMessage.success('保存成功');
             dispatch('search');
@@ -57,22 +48,13 @@ const actions = {
         }
         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(',') });
+                let res = await api.remove(ids.join(','));
                 if (res) {
                     ElMessage.success('删除成功');
                     dispatch('search');
diff --git a/src/store/modules/operation/recommand/recommandActivity.js b/src/store/modules/operation/recommend/recommendProduct.js
similarity index 69%
rename from src/store/modules/operation/recommand/recommandActivity.js
rename to src/store/modules/operation/recommend/recommendProduct.js
index 86aea52..069e09f 100644
--- a/src/store/modules/operation/recommand/recommandActivity.js
+++ b/src/store/modules/operation/recommend/recommendProduct.js
@@ -1,7 +1,7 @@
-import * as api from '@/api/sales/category.js';
+import * as api from '@/api/operation/recommend/recommendProduct.js';
 import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
 const state = () => ({
-    code: 'LimitActivity',
+    code: 'RecommendProductManagement',
     condition: {},
     list: [],
     total: 0,
@@ -24,11 +24,13 @@ const mutations = {
     setOpts: (state, data) => (state.opts = data),
 };
 const actions = {
-    search: async ({ state, commit }) => {
-        let res = await api.search(state.condition);
-        commit('setList', res);
+    search: async ({ state, commit, rootGetters }) => {
+        let data = { ...state.condition };
+        let res = await api.search({ ...rootGetters['local/page'](state.code), ...data });
+        commit('setList', res?.records || []);
+        commit('setTotal', res?.total || 0);
         if (!res) {
-            ElMessage.error('查询商品分类列表失败');
+            ElMessage.error('查询推荐商品列表失败');
         }
         return res;
     },
@@ -38,13 +40,13 @@ const actions = {
             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('加载详情失败');
+    enable: async ({ dispatch }, data) => {
+        let res = await api.enable({ id: data.id, isEnable: data.isEnable });
+        if (res) {
+            ElMessage.success('保存成功');
+            dispatch('search');
+        } else {
+            ElMessage.error('保存失败');
         }
         return res;
     },
@@ -59,22 +61,13 @@ const actions = {
         }
         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(',') });
+                let res = await api.remove(ids.join(','));
                 if (res) {
                     ElMessage.success('删除成功');
                     dispatch('search');
diff --git a/src/views/operation/limit/product.vue b/src/views/operation/limit/product.vue
index db608de..3d9d166 100644
--- a/src/views/operation/limit/product.vue
+++ b/src/views/operation/limit/product.vue
@@ -3,15 +3,10 @@
         <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)"
+                    :type="state.condition.activityTimeId === item.id ? 'primary' : 'default'"
+                    @click="state.condition.activityTimeId = item.id"
                 >
-                    <span>
-                        {{ item.label }}
-                    </span>
-                    <span>(</span>
-                    <span class="num">{{ summary[index] || 0 }}</span>
-                    <span>)</span>
+                    {{ item.timeName }}
                 </el-button>
             </li>
         </ul>
@@ -29,38 +24,53 @@
         >
             <template #search>
                 <el-form inline>
-                    <el-form-item label="商品名称" prop="name">
-                        <el-input v-model="state.condition.name" />
+                    <el-form-item label="商品名称" prop="productName">
+                        <el-input v-model="state.condition.productName" />
                     </el-form-item>
-                    <el-form-item label="商品分类" prop="category">
-                        <el-select v-model="state.condition.category" :opts="opts.category" />
+                    <el-form-item label="商品分类" prop="categoryId">
+                        <el-select v-model="state.condition.categoryId" :opts="opts.category" />
                     </el-form-item>
                 </el-form>
             </template>
         </TableList>
+        <ProductPicker ref="refsPicker" />
     </div>
 </template>
 
 <script setup lang="jsx">
     import ElButton from '@/components/extra/ElButton.vue';
+    import ProductPicker from './picker.vue';
     const store = useStore();
+    const route = useRoute();
     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');
+        store.dispatch('limitProduct/load', route.params.id);
     }
 
     /* 查询订单 */
     const state = reactive({
         condition: {
-            name: null,
-            category: null,
+            productName: null,
+            categoryId: null,
+            activityTimeId: null,
         },
     });
+    const handleReset = () => {
+        state.condition = {
+            productName: null,
+            categoryId: null,
+            activityTimeId: null,
+        };
+    };
+    const handleSearch = async () => {
+        loading.value = true;
+        await store.dispatch('limitProduct/search');
+        loading.value = false;
+    };
     watch(
         () => state.condition,
         (value) => {
@@ -69,50 +79,29 @@
         { immediate: true, deep: true }
     );
     watch(
-        () => state.condition.orderStatus,
+        () => state.condition.activityTimeId,
         () => {
             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;
-    };
+    watch(
+        () => unref(opts).timeRange,
+        () => {
+            state.condition.activityTimeId = unref(opts).timeRange[0]?.id;
+        },
+        { deep: true }
+    );
 
-    /* 导出订单 */
+    const refsPicker = ref(null);
     const handleCreate = async () => {
-        console.info('create');
+        unref(refsPicker).show();
     };
-    const handleRemove = (row, index) => {
-        console.info(row, index);
+    const handleRemove = async (rows) => {
+        await store.dispatch(
+            'limitProduct/remove',
+            rows.map((item) => item.id)
+        );
     };
     const handleSku = (row) => {
         console.info(row);
@@ -123,30 +112,25 @@
         columns: [
             {
                 label: '编号',
-                prop: 'orderNo',
+                prop: 'productId',
                 minWidth: 100,
             },
             {
                 label: '商品图片',
                 width: 100,
                 slots: {
-                    default: ({ row }) => <ElImage src={row.photo} alt={row.name} height="100px" />,
+                    default: ({ row }) => <ElImage src={row.productMainPicture} alt={row.productName} height="100px" />,
                 },
             },
             {
                 label: '商品名称',
-                prop: 'payAmount',
+                prop: 'productName',
                 minWidth: 240,
             },
             {
                 label: '商品价格',
-                prop: 'payTypeDesc',
-                width: 120,
-            },
-            {
-                label: '活动已售数量',
+                prop: 'productStartingPrice',
                 width: 120,
-                prop: 'orderSourceDesc',
             },
             {
                 label: 'SKU商品配置',
@@ -162,10 +146,10 @@
             {
                 label: '操作',
                 fixed: 'right',
-                width: 160,
+                width: 100,
                 slots: {
-                    default: ({ row, $index }) => (
-                        <ElButton type="text" onClick={() => handleRemove(row, $index)}>
+                    default: ({ row }) => (
+                        <ElButton type="text" onClick={() => handleRemove([row])}>
                             移除
                         </ElButton>
                     ),
diff --git a/src/views/operation/recommand/product.vue b/src/views/operation/recommand/product.vue
deleted file mode 100644
index db608de..0000000
--- a/src/views/operation/recommand/product.vue
+++ /dev/null
@@ -1,195 +0,0 @@
-<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/recommand/time.vue b/src/views/operation/recommand/time.vue
deleted file mode 100644
index 197a3e3..0000000
--- a/src/views/operation/recommand/time.vue
+++ /dev/null
@@ -1,150 +0,0 @@
-<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/src/views/operation/recommand/index.vue b/src/views/operation/recommend/index.vue
similarity index 78%
rename from src/views/operation/recommand/index.vue
rename to src/views/operation/recommend/index.vue
index f8c71e6..83ddeb4 100644
--- a/src/views/operation/recommand/index.vue
+++ b/src/views/operation/recommend/index.vue
@@ -33,12 +33,12 @@
     import ProductPicker from '@/views/sales/product/picker.vue';
     const store = useStore();
     const loading = ref(false);
-    const code = computed(() => store.state.recommandActivity.code);
-    const list = computed(() => store.state.recommandActivity.list);
-    const total = computed(() => store.state.recommandActivity.total);
-    const opts = computed(() => store.state.recommandActivity.opts);
+    const code = computed(() => store.state.recommendProduct.code);
+    const list = computed(() => _.cloneDeep(store.state.recommendProduct.list));
+    const total = computed(() => store.state.recommendProduct.total);
+    const opts = computed(() => store.state.recommendProduct.opts);
     if (!unref(opts).init) {
-        store.dispatch('recommandActivity/load');
+        store.dispatch('recommendProduct/load');
     }
 
     /* 列表查询 */
@@ -51,7 +51,7 @@
     watch(
         () => state.condition,
         (value) => {
-            store.commit('recommandActivity/setCondition', _.cloneDeep(value));
+            store.commit('recommendProduct/setCondition', _.cloneDeep(value));
         },
         { immediate: true, deep: true }
     );
@@ -63,9 +63,10 @@
     };
     const handleSearch = async () => {
         loading.value = true;
-        await store.dispatch('recommandActivity/search');
+        await store.dispatch('recommendProduct/search');
         loading.value = false;
     };
+    onActivated(handleSearch);
 
     const refsPicker = ref(null);
     // 添加/编辑
@@ -78,14 +79,16 @@
     };
 
     /* 操作 */
-    // 上下架
-    const handleEnable = (row, value) => {
-        row.enabled = value;
+    // 启用
+    const handleEnable = async (row) => {
+        loading.value = true;
+        await store.dispatch('recommendProduct/enable', row);
+        loading.value = false;
     };
     // 删除
-    const handleRemove = async (rows) => {
-        await store.dispatch(
-            'recommandActivity/remove',
+    const handleRemove = (rows) => {
+        store.dispatch(
+            'recommendProduct/remove',
             rows.map((item) => item.id)
         );
     };
@@ -115,9 +118,7 @@
                 label: '是否推荐',
                 width: 120,
                 slots: {
-                    default: ({ row }) => (
-                        <ElSwitch value={row.isEnable} onChange={(visible) => handleEnable(row, visible)} />
-                    ),
+                    default: ({ row }) => <ElSwitch v-model={row.isEnable} onChange={() => handleEnable(row)} />,
                 },
             },
             {
diff --git a/src/views/sales/product/index.vue b/src/views/sales/product/index.vue
index 6e5f89b..1881a9c 100644
--- a/src/views/sales/product/index.vue
+++ b/src/views/sales/product/index.vue
@@ -209,8 +209,8 @@
                         <div>
                             <ElSwitch value={row.hot} onInput={() => handleTag(row, 'hot')} active-text="爆款" />
                             <ElSwitch
-                                value={row.recommand}
-                                onInput={() => handleTag(row, 'recommand')}
+                                value={row.recommend}
+                                onInput={() => handleTag(row, 'recommend')}
                                 active-text="推荐"
                             />
                             <ElSwitch