From 2d80b2f2ac99219ff230b510c58139030f139d1b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=91=E6=96=87=E5=8F=AF?= <1041367524@qq.com>
Date: Tue, 7 Jun 2022 15:34:13 +0800
Subject: [PATCH 01/14] =?UTF-8?q?feat:=20IM=E4=B8=AD=E5=8F=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/im/index.js                | 105 ++++++++++++++
 src/store/modules/im/chatStore.js  |  78 +++++++++++
 src/store/modules/im/chatSystem.js |  73 ++++++++++
 src/store/modules/im/chatWaiter.js |  78 +++++++++++
 src/store/modules/im/im.js         |  83 +++++++++++
 src/store/modules/system/notify.js |   2 +-
 src/views/im/home/index.vue        |   7 +
 src/views/im/store/index.vue       | 190 +++++++++++++++++++++++++
 src/views/im/system/index.vue      | 164 ++++++++++++++++++++++
 src/views/im/waiter/index.vue      | 216 +++++++++++++++++++++++++++++
 vite.config.js                     |   4 +-
 11 files changed, 997 insertions(+), 3 deletions(-)
 create mode 100644 src/api/im/index.js
 create mode 100644 src/store/modules/im/chatStore.js
 create mode 100644 src/store/modules/im/chatSystem.js
 create mode 100644 src/store/modules/im/chatWaiter.js
 create mode 100644 src/store/modules/im/im.js
 create mode 100644 src/views/im/home/index.vue
 create mode 100644 src/views/im/store/index.vue
 create mode 100644 src/views/im/system/index.vue
 create mode 100644 src/views/im/waiter/index.vue

diff --git a/src/api/im/index.js b/src/api/im/index.js
new file mode 100644
index 0000000..aa51360
--- /dev/null
+++ b/src/api/im/index.js
@@ -0,0 +1,105 @@
+import request from '@/utils/request.js';
+export const online = () => {
+    return request({
+        url: '/im/admin/count/online',
+        method: 'get',
+    });
+};
+export const hours = (params) => {
+    return request({
+        url: '/im/admin/count/hoursMessage',
+        method: 'get',
+        params,
+    });
+};
+export const days = (params) => {
+    return request({
+        url: '/im/admin/count/daysMessage',
+        method: 'get',
+        params,
+    });
+};
+export const searchSystem = (params) => {
+    return request({
+        url: '/im/admin/thirdSystem',
+        method: 'get',
+        params,
+    });
+};
+export const createSystem = (data) => {
+    return request({
+        url: '/im/admin/thirdSystem',
+        method: 'post',
+        data,
+    });
+};
+export const updateSystem = (data) => {
+    return request({
+        url: '/im/admin/thirdSystem',
+        method: 'put',
+        data,
+    });
+};
+export const removeSystem = (data) => {
+    return request({
+        url: '/im/admin/thirdSystem',
+        method: 'delete',
+        data,
+    });
+};
+export const searchStore = (params) => {
+    return request({
+        url: '/im/admin/storeConfig',
+        method: 'get',
+        params,
+    });
+};
+export const createStore = (data) => {
+    return request({
+        url: '/im/admin/storeConfig',
+        method: 'post',
+        data,
+    });
+};
+export const updateStore = (data) => {
+    return request({
+        url: '/im/admin/storeConfig',
+        method: 'put',
+        data,
+    });
+};
+export const removeStore = (data) => {
+    return request({
+        url: '/im/admin/storeConfig',
+        method: 'delete',
+        data,
+    });
+};
+export const searchWaiter = (params) => {
+    return request({
+        url: '/im/admin/waiter',
+        method: 'get',
+        params,
+    });
+};
+export const createWaiter = (data) => {
+    return request({
+        url: '/im/admin/waiter',
+        method: 'post',
+        data,
+    });
+};
+export const updateWaiter = (data) => {
+    return request({
+        url: '/im/admin/waiter',
+        method: 'put',
+        data,
+    });
+};
+export const removeWaiter = (data) => {
+    return request({
+        url: '/im/admin/waiter',
+        method: 'delete',
+        data,
+    });
+};
diff --git a/src/store/modules/im/chatStore.js b/src/store/modules/im/chatStore.js
new file mode 100644
index 0000000..48528f4
--- /dev/null
+++ b/src/store/modules/im/chatStore.js
@@ -0,0 +1,78 @@
+import * as api from '@/api/im/index.js';
+import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
+const state = () => ({
+    code: 'ChatStore',
+    condition: {},
+    list: [],
+    total: 0,
+    opts: {
+        init: false,
+        system: [],
+    },
+});
+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),
+    setOpts: (state, data) => (state.opts = data),
+};
+const actions = {
+    search: async ({ state, commit, rootGetters }) => {
+        let data = { ...state.condition };
+        let res = await api.searchStore({ ...rootGetters['local/page'](state.code), ...data });
+        if (res) {
+            commit('setList', res.records);
+            commit('setTotal', res.total);
+        } else {
+            ElMessage.error('查询失败');
+            commit('setList', []);
+        }
+        return res;
+    },
+    load: async ({ commit }) => {
+        commit('setOpts', {
+            init: true,
+            system: (await api.searchSystem({ pageIndex: 1, length: 9999 }))?.records || [],
+        });
+    },
+    save: async ({ dispatch }, data) => {
+        if (data.id) {
+            data.systemId = data.sysId;
+        }
+        let save = data.id ? api.updateStore : api.createStore;
+        let res = await save(data);
+        if (res) {
+            ElMessage.success('保存成功');
+            dispatch('search');
+        } else {
+            ElMessage.error('保存失败');
+        }
+        return res;
+    },
+    remove: async ({ dispatch }, ids) => {
+        if (!ids.length) {
+            ElMessage.warning('请选择要删除的数据');
+        } else {
+            try {
+                await ElMessageBox.confirm('数据删除后无法恢复，确定要删除吗?', '危险操作');
+                let res = await api.removeStore({ ids });
+                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/im/chatSystem.js b/src/store/modules/im/chatSystem.js
new file mode 100644
index 0000000..7bc9559
--- /dev/null
+++ b/src/store/modules/im/chatSystem.js
@@ -0,0 +1,73 @@
+import * as api from '@/api/im/index.js';
+import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
+const state = () => ({
+    code: 'ChatSystem',
+    condition: {},
+    list: [],
+    total: 0,
+    opts: {
+        init: false,
+    },
+});
+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),
+    setOpts: (state, data) => (state.opts = data),
+};
+const actions = {
+    search: async ({ state, commit, rootGetters }) => {
+        let data = { ...state.condition };
+        let res = await api.searchSystem({ ...rootGetters['local/page'](state.code), ...data });
+        if (res) {
+            commit('setList', res.records);
+            commit('setTotal', res.total);
+        } else {
+            ElMessage.error('查询失败');
+            commit('setList', []);
+        }
+        return res;
+    },
+    load: async ({ commit }) => {
+        commit('setOpts', {
+            init: true,
+        });
+    },
+    save: async ({ dispatch }, data) => {
+        let save = data.id ? api.updateSystem : api.createSystem;
+        let res = await save(data);
+        if (res) {
+            ElMessage.success('保存成功');
+            dispatch('search');
+        } else {
+            ElMessage.error('保存失败');
+        }
+        return res;
+    },
+    remove: async ({ dispatch }, ids) => {
+        if (!ids.length) {
+            ElMessage.warning('请选择要删除的数据');
+        } else {
+            try {
+                await ElMessageBox.confirm('数据删除后无法恢复，确定要删除吗?', '危险操作');
+                let res = await api.removeSystem({ ids });
+                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/im/chatWaiter.js b/src/store/modules/im/chatWaiter.js
new file mode 100644
index 0000000..9ac965e
--- /dev/null
+++ b/src/store/modules/im/chatWaiter.js
@@ -0,0 +1,78 @@
+import * as api from '@/api/im/index.js';
+import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
+const state = () => ({
+    code: 'ChatWaiter',
+    condition: {},
+    list: [],
+    total: 0,
+    opts: {
+        init: false,
+        system: [],
+    },
+});
+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),
+    setOpts: (state, data) => (state.opts = data),
+};
+const actions = {
+    search: async ({ state, commit, rootGetters }) => {
+        let data = { ...state.condition };
+        let res = await api.searchWaiter({ ...rootGetters['local/page'](state.code), ...data });
+        if (res) {
+            commit('setList', res.records);
+            commit('setTotal', res.total);
+        } else {
+            ElMessage.error('查询失败');
+            commit('setList', []);
+        }
+        return res;
+    },
+    load: async ({ commit }) => {
+        commit('setOpts', {
+            init: true,
+            system: (await api.searchSystem({ pageIndex: 1, length: 9999 }))?.records || [],
+        });
+    },
+    save: async ({ dispatch }, data) => {
+        if (data.id) {
+            data.systemId = data.sysId;
+        }
+        let save = data.id ? api.updateWaiter : api.createWaiter;
+        let res = await save(data);
+        if (res) {
+            ElMessage.success('保存成功');
+            dispatch('search');
+        } else {
+            ElMessage.error('保存失败');
+        }
+        return res;
+    },
+    remove: async ({ dispatch }, ids) => {
+        if (!ids.length) {
+            ElMessage.warning('请选择要删除的数据');
+        } else {
+            try {
+                await ElMessageBox.confirm('数据删除后无法恢复，确定要删除吗?', '危险操作');
+                let res = await api.removeWaiter({ ids });
+                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/im/im.js b/src/store/modules/im/im.js
new file mode 100644
index 0000000..535c033
--- /dev/null
+++ b/src/store/modules/im/im.js
@@ -0,0 +1,83 @@
+import * as api from '@/api/system/notify.js';
+import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
+const state = () => ({
+    code: 'NotifyManagement',
+    condition: {},
+    list: [],
+    total: 0,
+    opts: {
+        init: false,
+    },
+});
+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),
+    setOpts: (state, data) => (state.opts = data),
+};
+const actions = {
+    search: async ({ state, commit, rootGetters }) => {
+        let data = { ...state.condition };
+        data.startReleaseTime = data.dateRange?.[0];
+        data.endReleaseTime = data.dateRange?.[1];
+        delete data.dateRange;
+        let res = await api.search({ ...rootGetters['local/page'](state.code), ...state.condition });
+        if (res) {
+            commit('setList', res.records);
+            commit('setTotal', res.total);
+        } else {
+            ElMessage.error('查询失败');
+            commit('setList', []);
+        }
+        return res;
+    },
+    load: async ({ commit }) => {
+        commit('setOpts', {
+            init: true,
+        });
+    },
+    detail: async (context, id) => {
+        let res = await api.detail(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;
+    },
+    remove: async ({ dispatch }, idList) => {
+        if (!idList.length) {
+            ElMessage.warning('请选择要删除的数据');
+        } else {
+            try {
+                await ElMessageBox.confirm('数据删除后无法恢复，确定要删除吗?', '危险操作');
+                let res = await api.remove(idList.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/system/notify.js b/src/store/modules/system/notify.js
index 535c033..d4a1d55 100644
--- a/src/store/modules/system/notify.js
+++ b/src/store/modules/system/notify.js
@@ -23,7 +23,7 @@ const actions = {
         data.startReleaseTime = data.dateRange?.[0];
         data.endReleaseTime = data.dateRange?.[1];
         delete data.dateRange;
-        let res = await api.search({ ...rootGetters['local/page'](state.code), ...state.condition });
+        let res = await api.search({ ...rootGetters['local/page'](state.code), ...data });
         if (res) {
             commit('setList', res.records);
             commit('setTotal', res.total);
diff --git a/src/views/im/home/index.vue b/src/views/im/home/index.vue
new file mode 100644
index 0000000..914fcd1
--- /dev/null
+++ b/src/views/im/home/index.vue
@@ -0,0 +1,7 @@
+<template>
+    <div>在线人数</div>
+</template>
+
+<script setup></script>
+
+<style lang="less" scoped></style>
diff --git a/src/views/im/store/index.vue b/src/views/im/store/index.vue
new file mode 100644
index 0000000..9706e0b
--- /dev/null
+++ b/src/views/im/store/index.vue
@@ -0,0 +1,190 @@
+<template>
+    <div class="list-container">
+        <table-list
+            v-loading="loading"
+            :code="code"
+            :config="config"
+            :data="list"
+            :operation="['create', 'search', 'remove']"
+            :reset="handleReset"
+            title="店铺"
+            :total="total"
+            @create="handleCreate()"
+            @remove="handleRemove"
+            @search="handleSearch"
+        >
+            <template #search>
+                <el-form inline>
+                    <el-form-item label="所属系统" prop="sysId">
+                        <el-select
+                            v-model="state.condition.sysId"
+                            :config="{ label: 'name', value: 'id' }"
+                            :opts="opts.system"
+                        />
+                    </el-form-item>
+                </el-form>
+            </template>
+        </table-list>
+        <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="sysId">
+                    <el-select
+                        v-model="formState.form.sysId"
+                        :config="{ label: 'name', value: 'id' }"
+                        :disabled="formState.form.id"
+                        :opts="opts.system"
+                    />
+                </el-form-item>
+                <el-form-item label="店铺头像" prop="avatar">
+                    <el-upload-image v-model="formState.form.avatar" config-id="im/" />
+                </el-form-item>
+                <el-form-item label="店铺名称" prop="name">
+                    <el-input v-model="formState.form.name" />
+                </el-form-item>
+            </el-form>
+            <template #footer>
+                <el-button @click="formState.formVisible = false">取消</el-button>
+                <el-button :loading="formState.submitting" type="primary" @click="handleSave">保存</el-button>
+            </template>
+        </el-dialog>
+    </div>
+</template>
+
+<script setup lang="jsx">
+    import ElButton from '@/components/extra/ElButton.vue';
+    import ElImage from '@/components/extra/ElImage.vue';
+    const store = useStore();
+    const route = useRoute();
+    const { proxy } = getCurrentInstance();
+    const loading = ref(false);
+    const code = computed(() => store.state.chatStore.code);
+    const list = computed(() => store.state.chatStore.list);
+    const total = computed(() => store.state.chatStore.total);
+    const opts = computed(() => store.state.chatStore.opts);
+    if (!unref(opts).init) {
+        store.dispatch('chatStore/load');
+    }
+    const state = reactive({
+        condition: {
+            sysId: null,
+        },
+    });
+    const handleReset = () => {
+        state.condition = {
+            sysId: null,
+        };
+    };
+    const handleSearch = async () => {
+        loading.value = true;
+        await store.dispatch('chatStore/search');
+        loading.value = false;
+    };
+    watch(
+        () => state.condition,
+        (value) => {
+            store.commit('chatStore/setCondition', _.cloneDeep(value));
+            handleSearch();
+        },
+        { immediate: true, deep: true }
+    );
+    onActivated(() => {
+        let sysId = route.query.sysId;
+        if (sysId) {
+            state.condition.sysId = +sysId;
+        } else {
+            handleSearch();
+        }
+    });
+
+    /* 表单 */
+    const refsForm = ref(null);
+    const formState = reactive({
+        formVisible: false,
+        submitting: false,
+        form: {
+            id: null,
+            sysId: null,
+            name: null,
+            avatar: null,
+        },
+        rules: {
+            sysId: [{ required: true, message: '所属系统不能为空' }],
+            name: [{ required: true, message: '店铺名称不能为空' }],
+            avatar: [{ required: true, message: '店铺头像不能为空' }],
+        },
+    });
+    // 添加/编辑
+    const handleCreate = (row) => {
+        Object.assign(
+            formState.form,
+            row || {
+                id: null,
+                sysId: null,
+                name: null,
+                avatar: null,
+            }
+        );
+        formState.formVisible = true;
+    };
+    // 保存
+    const handleSave = async () => {
+        formState.submitting = true;
+        try {
+            await proxy.$validate(refsForm);
+            let data = _.cloneDeep(formState.form);
+            await store.dispatch('chatStore/save', data);
+            formState.formVisible = false;
+        } catch (e) {
+            console.info('取消保存', e);
+        }
+        formState.submitting = false;
+    };
+    const handleRemove = async (rows) => {
+        store.dispatch(
+            'chatStore/remove',
+            rows.map((item) => item.id)
+        );
+    };
+    const config = reactive({
+        // 表格列配置
+        columns: [
+            {
+                label: '所属系统',
+                width: 160,
+                slots: {
+                    default: ({ row }) => proxy.$dict(unref(opts).system, row.sysId, { label: 'name', value: 'id' }),
+                },
+            },
+            {
+                label: '店铺头像',
+                width: 160,
+                slots: {
+                    default: ({ row }) => <ElImage src={row.avatar} alt={row.name} />,
+                },
+            },
+            {
+                label: '店铺名称',
+                prop: 'name',
+            },
+            {
+                label: '操作',
+                fixed: 'right',
+                slots: {
+                    default: ({ row }) => (
+                        <div>
+                            <ElButton type="text" onClick={() => handleCreate(row)}>
+                                编辑
+                            </ElButton>
+                            <ElButton type="text" onClick={() => handleRemove([row])}>
+                                删除
+                            </ElButton>
+                        </div>
+                    ),
+                },
+                width: 120,
+            },
+        ],
+    });
+</script>
+
+<style lang="less" scoped></style>
diff --git a/src/views/im/system/index.vue b/src/views/im/system/index.vue
new file mode 100644
index 0000000..8f29ace
--- /dev/null
+++ b/src/views/im/system/index.vue
@@ -0,0 +1,164 @@
+<template>
+    <div class="list-container">
+        <table-list
+            v-loading="loading"
+            :code="code"
+            :config="config"
+            :data="list"
+            :operation="['create', 'search', 'remove']"
+            :reset="handleReset"
+            title="系统"
+            :total="total"
+            @create="handleCreate()"
+            @remove="handleRemove"
+            @search="handleSearch"
+        />
+        <el-dialog v-model="formState.formVisible" :title="formState.form.id ? '查看' : '添加' + '系统'">
+            <el-form
+                ref="refsForm"
+                :disabled="!!formState.form.id"
+                label-width="100px"
+                :model="formState.form"
+                :rules="formState.rules"
+            >
+                <el-form-item label="系统标识" prop="client">
+                    <el-input v-model="formState.form.client" />
+                </el-form-item>
+                <el-form-item label="系统名称" prop="name">
+                    <el-input v-model="formState.form.name" />
+                </el-form-item>
+            </el-form>
+            <template #footer>
+                <el-button @click="formState.formVisible = false">取消</el-button>
+                <el-button v-if="!formState.form.id" :loading="formState.submitting" type="primary" @click="handleSave">
+                    保存
+                </el-button>
+            </template>
+        </el-dialog>
+    </div>
+</template>
+
+<script setup lang="jsx">
+    import ElButton from '@/components/extra/ElButton.vue';
+    const store = useStore();
+    const router = useRouter();
+    const { proxy } = getCurrentInstance();
+    const loading = ref(false);
+    const code = computed(() => store.state.chatSystem.code);
+    const list = computed(() => store.state.chatSystem.list);
+    const total = computed(() => store.state.chatSystem.total);
+    const opts = computed(() => store.state.chatSystem.opts);
+    if (!unref(opts).init) {
+        store.dispatch('chatSystem/load');
+    }
+    const state = reactive({
+        condition: {
+            title: null,
+            dateRange: [],
+        },
+    });
+    watch(
+        () => state.condition,
+        (value) => {
+            store.commit('chatSystem/setCondition', _.cloneDeep(value));
+        },
+        { immediate: true, deep: true }
+    );
+    const handleReset = () => {
+        state.condition = {
+            title: null,
+            dateRange: [],
+        };
+    };
+    const handleSearch = async () => {
+        loading.value = true;
+        await store.dispatch('chatSystem/search');
+        loading.value = false;
+    };
+    onActivated(handleSearch);
+
+    /* 表单 */
+    const refsForm = ref(null);
+    const formState = reactive({
+        formVisible: false,
+        submitting: false,
+        form: {
+            id: null,
+            client: null,
+            name: null,
+        },
+        rules: {
+            client: [{ required: true, message: '系统标识不能为空' }],
+            name: [{ required: true, message: '系统名称不能为空' }],
+        },
+    });
+    // 添加/编辑
+    const handleCreate = (row) => {
+        Object.assign(
+            formState.form,
+            row || {
+                id: null,
+                client: null,
+                name: null,
+            }
+        );
+        formState.formVisible = true;
+    };
+    // 保存
+    const handleSave = async () => {
+        formState.submitting = true;
+        try {
+            await proxy.$validate(refsForm);
+            let data = _.cloneDeep(formState.form);
+            await store.dispatch('chatSystem/save', data);
+            formState.formVisible = false;
+        } catch (e) {
+            console.info('取消保存', e);
+        }
+        formState.submitting = false;
+    };
+    const handleRemove = async (rows) => {
+        store.dispatch(
+            'chatSystem/remove',
+            rows.map((item) => item.id)
+        );
+    };
+    const handleStore = (row) => {
+        router.push({ name: 'ChatStore', query: { sysId: row.id } });
+    };
+    const config = reactive({
+        // 表格列配置
+        columns: [
+            {
+                label: '系统标识',
+                prop: 'client',
+            },
+            {
+                label: '系统名称',
+                prop: 'name',
+            },
+            {
+                label: '操作',
+                fixed: 'right',
+                width: 160,
+                slots: {
+                    default: ({ row }) => (
+                        <div>
+                            <ElButton type="text" onClick={() => handleCreate(row)}>
+                                查看
+                            </ElButton>
+                            <ElButton type="text" onClick={() => handleStore(row)}>
+                                店铺
+                            </ElButton>
+                            <ElButton type="text" onClick={() => handleRemove([row])}>
+                                删除
+                            </ElButton>
+                        </div>
+                    ),
+                },
+            },
+        ],
+    });
+</script>
+
+<style lang="less" scoped></style>
diff --git a/src/views/im/waiter/index.vue b/src/views/im/waiter/index.vue
new file mode 100644
index 0000000..80e253f
--- /dev/null
+++ b/src/views/im/waiter/index.vue
@@ -0,0 +1,216 @@
+<template>
+    <div class="list-container">
+        <table-list
+            v-loading="loading"
+            :code="code"
+            :config="config"
+            :data="list"
+            :operation="['create', 'search', 'remove']"
+            :reset="handleReset"
+            title="客服"
+            :total="total"
+            @create="handleCreate()"
+            @remove="handleRemove"
+            @search="handleSearch"
+        >
+            <template #search>
+                <el-form inline>
+                    <el-form-item label="所属系统" prop="systemId">
+                        <el-select
+                            v-model="state.condition.systemId"
+                            :config="{ label: 'name', value: 'id' }"
+                            :opts="opts.system"
+                        />
+                    </el-form-item>
+                    <el-form-item label="客服ID" prop="waiterId">
+                        <el-input v-model="state.condition.waiterId" />
+                    </el-form-item>
+                    <el-form-item label="客服昵称" prop="waiterNickname">
+                        <el-input v-model="state.condition.waiterNickname" />
+                    </el-form-item>
+                </el-form>
+            </template>
+        </table-list>
+        <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="systemId">
+                    <el-select
+                        v-model="formState.form.sysId"
+                        :config="{ label: 'name', value: 'id' }"
+                        :disabled="formState.form.id"
+                        :opts="opts.system"
+                    />
+                </el-form-item>
+                <el-form-item label="客服类型" prop="type">
+                    <el-radio-group v-model="formState.form.type" :opts="opts.type" />
+                </el-form-item>
+                <el-form-item label="客服头像" prop="waiterAvatar">
+                    <el-upload-image v-model="formState.form.waiterAvatar" config-id="im/" />
+                </el-form-item>
+                <el-form-item label="客服ID" prop="waiterId">
+                    <el-input v-model="formState.form.waiterId" />
+                </el-form-item>
+                <el-form-item label="客服昵称" prop="waiterNickname">
+                    <el-input v-model="formState.form.waiterNickname" />
+                </el-form-item>
+            </el-form>
+            <template #footer>
+                <el-button @click="formState.formVisible = false">取消</el-button>
+                <el-button :loading="formState.submitting" type="primary" @click="handleSave">保存</el-button>
+            </template>
+        </el-dialog>
+    </div>
+</template>
+
+<script setup lang="jsx">
+    import ElButton from '@/components/extra/ElButton.vue';
+    import ElImage from '@/components/extra/ElImage.vue';
+    const store = useStore();
+    const route = useRoute();
+    const { proxy } = getCurrentInstance();
+    const loading = ref(false);
+    const code = computed(() => store.state.chatWaiter.code);
+    const list = computed(() => store.state.chatWaiter.list);
+    const total = computed(() => store.state.chatWaiter.total);
+    const opts = computed(() => store.state.chatWaiter.opts);
+    if (!unref(opts).init) {
+        store.dispatch('chatWaiter/load');
+    }
+    const state = reactive({
+        condition: {
+            systemId: null,
+            waiterId: null,
+            waiterNickname: null,
+        },
+    });
+    const handleReset = () => {
+        state.condition = {
+            systemId: null,
+            waiterId: null,
+            waiterNickname: null,
+        };
+    };
+    const handleSearch = async () => {
+        loading.value = true;
+        await store.dispatch('chatWaiter/search');
+        loading.value = false;
+    };
+    watch(
+        () => state.condition,
+        (value) => {
+            store.commit('chatWaiter/setCondition', _.cloneDeep(value));
+            handleSearch();
+        },
+        { immediate: true, deep: true }
+    );
+    onActivated(() => {
+        let sysId = route.query.sysId;
+        if (sysId) {
+            state.condition.sysId = +sysId;
+        } else {
+            handleSearch();
+        }
+    });
+
+    /* 表单 */
+    const refsForm = ref(null);
+    const formState = reactive({
+        formVisible: false,
+        submitting: false,
+        form: {
+            id: null,
+            systemId: null,
+            type: 0,
+            waiterAvatar: null,
+            waiterId: null,
+            waiterNickname: null,
+        },
+        rules: {
+            systemId: [{ required: true, message: '所属系统不能为空' }],
+            type: [{ required: true, message: '客服类型不能为空' }],
+            waiterAvatar: [{ required: true, message: '客服头像不能为空' }],
+            waiterId: [{ required: true, message: '客服ID不能为空' }],
+            waiterNickname: [{ required: true, message: '客服昵称不能为空' }],
+        },
+    });
+    // 添加/编辑
+    const handleCreate = (row) => {
+        Object.assign(
+            formState.form,
+            row || {
+                id: null,
+                systemId: null,
+                type: 0,
+                waiterAvatar: null,
+                waiterId: null,
+                waiterNickname: null,
+            }
+        );
+        formState.formVisible = true;
+    };
+    // 保存
+    const handleSave = async () => {
+        formState.submitting = true;
+        try {
+            await proxy.$validate(refsForm);
+            let data = _.cloneDeep(formState.form);
+            await store.dispatch('chatWaiter/save', data);
+            formState.formVisible = false;
+        } catch (e) {
+            console.info('取消保存', e);
+        }
+        formState.submitting = false;
+    };
+    const handleRemove = async (rows) => {
+        store.dispatch(
+            'chatWaiter/remove',
+            rows.map((item) => item.id)
+        );
+    };
+    const config = reactive({
+        // 表格列配置
+        columns: [
+            {
+                label: '所属系统',
+                width: 160,
+                slots: {
+                    default: ({ row }) => proxy.$dict(unref(opts).system, row.sysId, { label: 'name', value: 'id' }),
+                },
+            },
+            {
+                label: '客服头像',
+                width: 160,
+                slots: {
+                    default: ({ row }) => <ElImage src={row.waiterAvatar} alt={row.waiterNickname} />,
+                },
+            },
+            {
+                label: '客服ID',
+                prop: 'waiterId',
+            },
+            {
+                label: '客服昵称',
+                prop: 'waiterNickname',
+            },
+            {
+                label: '操作',
+                fixed: 'right',
+                slots: {
+                    default: ({ row }) => (
+                        <div>
+                            <ElButton type="text" onClick={() => handleCreate(row)}>
+                                编辑
+                            </ElButton>
+                            <ElButton type="text" onClick={() => handleRemove([row])}>
+                                删除
+                            </ElButton>
+                        </div>
+                    ),
+                },
+                width: 120,
+            },
+        ],
+    });
+</script>
+
+<style lang="less" scoped></style>
diff --git a/vite.config.js b/vite.config.js
index 611fffc..e61b7e3 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -23,9 +23,9 @@ export default (configEnv) => {
                     // target: 'http://192.168.10.109:8090/', // 显雨
                     // target: 'http://192.168.10.5:4500', // 高玉
                     // target: 'http://192.168.10.67:8090', // 罗战
-                    // target: 'http://192.168.10.93:8090', // 周渺
+                    target: 'http://192.168.10.94:8090', // 周渺
                     // target: 'http://192.168.10.124:8090', // 舒梦娇
-                    target: 'https://k8s-horse-gateway.mashibing.cn/', // 测试地址
+                    // target: 'https://k8s-horse-gateway.mashibing.cn/', // 测试地址
                     // target: 'https://you-gateway.mashibing.com', // 生产环境
                     changeOrigin: true,
                     rewrite: (path) => path.replace(/^\/api/, ''),

From e2f84193cd83b0824c866923f6935ac685a5295d 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, 8 Jun 2022 14:33:25 +0800
Subject: [PATCH 02/14] =?UTF-8?q?feat:=20=E6=8E=A5=E5=8F=A3=E5=AF=B9?=
 =?UTF-8?q?=E6=8E=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/store/modules/im/chatWaiter.js | 14 ++---
 src/utils/request.js               |  8 +++
 src/views/im/store/index.vue       | 22 +++++++-
 src/views/im/system/index.vue      |  1 +
 src/views/im/waiter/index.vue      | 82 +++++++++++++++++++-----------
 5 files changed, 89 insertions(+), 38 deletions(-)

diff --git a/src/store/modules/im/chatWaiter.js b/src/store/modules/im/chatWaiter.js
index 9ac965e..3d4c0d7 100644
--- a/src/store/modules/im/chatWaiter.js
+++ b/src/store/modules/im/chatWaiter.js
@@ -7,7 +7,7 @@ const state = () => ({
     total: 0,
     opts: {
         init: false,
-        system: [],
+        store: [],
     },
 });
 const getters = {};
@@ -34,12 +34,12 @@ const actions = {
     load: async ({ commit }) => {
         commit('setOpts', {
             init: true,
-            system: (await api.searchSystem({ pageIndex: 1, length: 9999 }))?.records || [],
+            store: (await api.searchStore({ pageIndex: 1, length: 9999 }))?.records || [],
         });
     },
-    save: async ({ dispatch }, data) => {
+    save: async ({ state, dispatch }, data) => {
         if (data.id) {
-            data.systemId = data.sysId;
+            data.systemId = state.condition.systemid;
         }
         let save = data.id ? api.updateWaiter : api.createWaiter;
         let res = await save(data);
@@ -51,13 +51,13 @@ const actions = {
         }
         return res;
     },
-    remove: async ({ dispatch }, ids) => {
-        if (!ids.length) {
+    remove: async ({ dispatch }, data) => {
+        if (!data.waiterIds.length) {
             ElMessage.warning('请选择要删除的数据');
         } else {
             try {
                 await ElMessageBox.confirm('数据删除后无法恢复，确定要删除吗?', '危险操作');
-                let res = await api.removeWaiter({ ids });
+                let res = await api.removeWaiter(data);
                 if (res) {
                     ElMessage.success('删除成功');
                     dispatch('search');
diff --git a/src/utils/request.js b/src/utils/request.js
index 034ba57..c25c604 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -61,6 +61,14 @@ instance.interceptors.request.use(
         if (token) {
             config.headers['Authorization'] = token;
         }
+        config.params = Object.fromEntries(
+            Object.entries(config.params || {}).filter(
+                (entry) =>
+                    entry[1] !== null &&
+                    typeof entry[1] !== 'undefined' &&
+                    (typeof entry[1] !== 'string' || entry[1].trim() !== '')
+            )
+        );
         if (config.data && config.headers['Content-Type'] === 'application/x-www-form-urlencoded;charset=UTF-8') {
             config.data = qs.stringify(config.data);
         }
diff --git a/src/views/im/store/index.vue b/src/views/im/store/index.vue
index 9706e0b..cf7cf76 100644
--- a/src/views/im/store/index.vue
+++ b/src/views/im/store/index.vue
@@ -26,7 +26,13 @@
             </template>
         </table-list>
         <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
+                ref="refsForm"
+                v-loading="formState.submitting"
+                label-width="100px"
+                :model="formState.form"
+                :rules="formState.rules"
+            >
                 <el-form-item label="所属系统" prop="sysId">
                     <el-select
                         v-model="formState.form.sysId"
@@ -55,6 +61,7 @@
     import ElImage from '@/components/extra/ElImage.vue';
     const store = useStore();
     const route = useRoute();
+    const router = useRouter();
     const { proxy } = getCurrentInstance();
     const loading = ref(false);
     const code = computed(() => store.state.chatStore.code);
@@ -145,6 +152,14 @@
             rows.map((item) => item.id)
         );
     };
+    const handleWaiter = (row) => {
+        router.push({
+            name: 'ChatWaiter',
+            query: {
+                storeId: row.id,
+            },
+        });
+    };
     const config = reactive({
         // 表格列配置
         columns: [
@@ -169,19 +184,22 @@
             {
                 label: '操作',
                 fixed: 'right',
+                width: 160,
                 slots: {
                     default: ({ row }) => (
                         <div>
                             <ElButton type="text" onClick={() => handleCreate(row)}>
                                 编辑
                             </ElButton>
+                            <ElButton type="text" onClick={() => handleWaiter(row)}>
+                                客服
+                            </ElButton>
                             <ElButton type="text" onClick={() => handleRemove([row])}>
                                 删除
                             </ElButton>
                         </div>
                     ),
                 },
-                width: 120,
             },
         ],
     });
diff --git a/src/views/im/system/index.vue b/src/views/im/system/index.vue
index 8f29ace..ec1496a 100644
--- a/src/views/im/system/index.vue
+++ b/src/views/im/system/index.vue
@@ -16,6 +16,7 @@
         <el-dialog v-model="formState.formVisible" :title="formState.form.id ? '查看' : '添加' + '系统'">
             <el-form
                 ref="refsForm"
+                v-loading="formState.submitting"
                 :disabled="!!formState.form.id"
                 label-width="100px"
                 :model="formState.form"
diff --git a/src/views/im/waiter/index.vue b/src/views/im/waiter/index.vue
index 80e253f..9eb27fb 100644
--- a/src/views/im/waiter/index.vue
+++ b/src/views/im/waiter/index.vue
@@ -15,11 +15,11 @@
         >
             <template #search>
                 <el-form inline>
-                    <el-form-item label="所属系统" prop="systemId">
+                    <el-form-item label="所属店铺" prop="storeId">
                         <el-select
-                            v-model="state.condition.systemId"
+                            v-model="state.condition.storeId"
                             :config="{ label: 'name', value: 'id' }"
-                            :opts="opts.system"
+                            :opts="opts.store"
                         />
                     </el-form-item>
                     <el-form-item label="客服ID" prop="waiterId">
@@ -32,23 +32,29 @@
             </template>
         </table-list>
         <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="systemId">
+            <el-form
+                ref="refsForm"
+                v-loading="formState.submitting"
+                label-width="100px"
+                :model="formState.form"
+                :rules="formState.rules"
+            >
+                <el-form-item label="所属店铺" prop="storeId">
                     <el-select
-                        v-model="formState.form.sysId"
+                        v-model="formState.form.storeId"
                         :config="{ label: 'name', value: 'id' }"
                         :disabled="formState.form.id"
-                        :opts="opts.system"
+                        :opts="opts.store"
                     />
                 </el-form-item>
                 <el-form-item label="客服类型" prop="type">
-                    <el-radio-group v-model="formState.form.type" :opts="opts.type" />
+                    <el-input v-model="formState.form.type" />
                 </el-form-item>
                 <el-form-item label="客服头像" prop="waiterAvatar">
                     <el-upload-image v-model="formState.form.waiterAvatar" config-id="im/" />
                 </el-form-item>
                 <el-form-item label="客服ID" prop="waiterId">
-                    <el-input v-model="formState.form.waiterId" />
+                    <el-input v-model="formState.form.waiterId" :disabled="!!formState.form.id" />
                 </el-form-item>
                 <el-form-item label="客服昵称" prop="waiterNickname">
                     <el-input v-model="formState.form.waiterNickname" />
@@ -78,35 +84,50 @@
     }
     const state = reactive({
         condition: {
-            systemId: null,
+            storeId: null,
             waiterId: null,
             waiterNickname: null,
         },
     });
     const handleReset = () => {
         state.condition = {
-            systemId: null,
+            storeId: null,
             waiterId: null,
             waiterNickname: null,
         };
     };
     const handleSearch = async () => {
-        loading.value = true;
-        await store.dispatch('chatWaiter/search');
-        loading.value = false;
+        if (state.condition.storeId) {
+            loading.value = true;
+            await store.dispatch('chatWaiter/search');
+            loading.value = false;
+        }
     };
+    watch(
+        () => unref(opts).store,
+        (value) => {
+            if (!state.condition.storeId) {
+                state.condition.storeId = value[0]?.id;
+            }
+        }
+    );
     watch(
         () => state.condition,
         (value) => {
             store.commit('chatWaiter/setCondition', _.cloneDeep(value));
-            handleSearch();
         },
         { immediate: true, deep: true }
     );
+    watch(
+        () => state.condition.storeId,
+        () => {
+            handleSearch();
+        }
+    );
     onActivated(() => {
-        let sysId = route.query.sysId;
-        if (sysId) {
-            state.condition.sysId = +sysId;
+        let storeId = route.query.storeId;
+        if (storeId) {
+            state.condition.storeId = +storeId;
         } else {
             handleSearch();
         }
@@ -119,14 +140,14 @@
         submitting: false,
         form: {
             id: null,
-            systemId: null,
-            type: 0,
+            storeId: null,
+            type: null,
             waiterAvatar: null,
             waiterId: null,
             waiterNickname: null,
         },
         rules: {
-            systemId: [{ required: true, message: '所属系统不能为空' }],
+            storeId: [{ required: true, message: '所属店铺不能为空' }],
             type: [{ required: true, message: '客服类型不能为空' }],
             waiterAvatar: [{ required: true, message: '客服头像不能为空' }],
             waiterId: [{ required: true, message: '客服ID不能为空' }],
@@ -139,13 +160,16 @@
             formState.form,
             row || {
                 id: null,
-                systemId: null,
-                type: 0,
+                storeId: null,
+                type: null,
                 waiterAvatar: null,
                 waiterId: null,
                 waiterNickname: null,
             }
         );
+        if (!formState.form.storeId) {
+            formState.form.storeId = state.condition.storeId;
+        }
         formState.formVisible = true;
     };
     // 保存
@@ -162,19 +186,19 @@
         formState.submitting = false;
     };
     const handleRemove = async (rows) => {
-        store.dispatch(
-            'chatWaiter/remove',
-            rows.map((item) => item.id)
-        );
+        store.dispatch('chatWaiter/remove', {
+            storeId: state.condition.storeId,
+            waiterIds: rows.map((item) => item.waiterId),
+        });
     };
     const config = reactive({
         // 表格列配置
         columns: [
             {
-                label: '所属系统',
+                label: '所属店铺',
                 width: 160,
                 slots: {
-                    default: ({ row }) => proxy.$dict(unref(opts).system, row.sysId, { label: 'name', value: 'id' }),
+                    default: ({ row }) => proxy.$dict(unref(opts).store, row.storeId, { label: 'name', value: 'id' }),
                 },
             },
             {

From 56a45fb9bfdbe724e920b34a3451c49fe6cd94d1 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, 8 Jun 2022 15:27:03 +0800
Subject: [PATCH 03/14] =?UTF-8?q?feat:=20=E9=A6=96=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/im/index.js              |   3 +-
 src/store/modules/im/chatHome.js |  45 +++++++++++
 src/views/im/home/index.vue      | 125 ++++++++++++++++++++++++++++++-
 3 files changed, 169 insertions(+), 4 deletions(-)
 create mode 100644 src/store/modules/im/chatHome.js

diff --git a/src/api/im/index.js b/src/api/im/index.js
index aa51360..52f51f7 100644
--- a/src/api/im/index.js
+++ b/src/api/im/index.js
@@ -1,8 +1,9 @@
 import request from '@/utils/request.js';
-export const online = () => {
+export const online = (params) => {
     return request({
         url: '/im/admin/count/online',
         method: 'get',
+        params,
     });
 };
 export const hours = (params) => {
diff --git a/src/store/modules/im/chatHome.js b/src/store/modules/im/chatHome.js
new file mode 100644
index 0000000..81a9909
--- /dev/null
+++ b/src/store/modules/im/chatHome.js
@@ -0,0 +1,45 @@
+import * as api from '@/api/im/index.js';
+import { ElMessage } from '@/plugins/element-plus';
+const state = () => ({
+    online: 0,
+    single: [],
+    range: [],
+});
+const getters = {};
+const mutations = {
+    setOnline: (state, data) => (state.online = data),
+    setSingle: (state, data) => (state.single = data),
+    setRange: (state, data) => (state.range = data),
+};
+const actions = {
+    loadOnline: async ({ commit }, data) => {
+        let res = await api.online(data);
+        commit('setOnline', res || 0);
+        if (!res) {
+            ElMessage.error('查询失败');
+        }
+        return res;
+    },
+    loadSingle: async ({ commit }, data) => {
+        let res = await api.hours(data);
+        commit('setSingle', res || []);
+        if (!res) {
+            ElMessage.error('查询失败');
+        }
+        return res;
+    },
+    loadRange: async ({ commit }, data) => {
+        let res = await api.days(data);
+        commit('setRange', res || []);
+        if (!res) {
+            ElMessage.error('查询失败');
+        }
+        return res;
+    },
+};
+export default {
+    state,
+    getters,
+    mutations,
+    actions,
+};
diff --git a/src/views/im/home/index.vue b/src/views/im/home/index.vue
index 914fcd1..125e29f 100644
--- a/src/views/im/home/index.vue
+++ b/src/views/im/home/index.vue
@@ -1,7 +1,126 @@
 <template>
-    <div>在线人数</div>
+    <div class="home-container">
+        <el-form>
+            <el-form-item label="所属系统">
+                <el-select v-model="systemId" :config="{ label: 'name', value: 'id' }" :opts="opts.system" />
+            </el-form-item>
+        </el-form>
+        <el-card header="在线人数">{{ online }}</el-card>
+        <el-card>
+            <template #header>
+                <div class="flex">
+                    <p>单日消息量</p>
+                    <el-date-picker v-model="date1" type="date" value-format="YYYY-MM-DD" />
+                </div>
+            </template>
+            <div class="chart chart-1"></div>
+        </el-card>
+        <el-card>
+            <template #header>
+                <div class="flex">
+                    <p>历史消息量</p>
+                    <el-date-picker
+                        v-model="date2"
+                        :default-time="[new Date(0, 0, 0, 0, 0, 0), new Date(0, 0, 0, 23, 59, 59)]"
+                        type="datetimerange"
+                        value-format="x"
+                    />
+                </div>
+            </template>
+            <div class="chart chart-2"></div>
+        </el-card>
+    </div>
 </template>
 
-<script setup></script>
+<script setup>
+    const store = useStore();
+    const loading = ref(false);
+    const opts = computed(() => store.state.chatStore.opts);
+    if (!unref(opts).init) {
+        store.dispatch('chatStore/load');
+    }
 
-<style lang="less" scoped></style>
+    const systemId = ref(null);
+    watch(
+        () => unref(opts).system,
+        (value) => {
+            if (!unref(systemId)) {
+                systemId.value = value?.[0]?.id;
+            }
+        },
+        { immediate: true }
+    );
+    const online = computed(() => store.state.chatHome.online);
+    const handleLoadOnline = async () => {
+        loading.value = true;
+        if (unref(systemId)) {
+            await store.dispatch('chatHome/loadOnline', { systemId: unref(systemId) });
+        }
+        loading.value = false;
+    };
+    watch(systemId, handleLoadOnline);
+
+    const date1 = ref(null);
+    const handleLoadSingle = async () => {
+        loading.value = true;
+        if (unref(systemId)) {
+            if (unref(date1)) {
+                await store.dispatch('chatHome/loadSingle', {
+                    systemId: unref(systemId),
+                    start: new Date(unref(date1) + ' 00:00:00').getTime(),
+                    end: new Date(unref(date1) + ' 23:59:59').getTime(),
+                });
+            } else {
+                store.commit('setSingle', []);
+            }
+        }
+        loading.value = false;
+    };
+    watch(date1, handleLoadSingle);
+
+    const date2 = ref([]);
+    const handleLoadRange = async () => {
+        loading.value = true;
+        if (unref(systemId)) {
+            if (unref(date2)?.length) {
+                await store.dispatch('chatHome/loadRange', {
+                    systemId: unref(systemId),
+                    start: unref(date2)[0],
+                    end: unref(date2)[1],
+                });
+            } else {
+                store.commit('setSingle', []);
+            }
+        }
+        loading.value = false;
+    };
+    watch(date2, handleLoadRange);
+
+    onActivated(() => {
+        handleLoadOnline();
+        handleLoadSingle();
+        handleLoadRange();
+    });
+</script>
+
+<style lang="less" scoped>
+    .home-container {
+        .flex {
+            display: flex;
+            align-items: center;
+            p {
+                margin-right: 20px;
+            }
+        }
+        .el-card {
+            & + .el-card {
+                margin-top: 30px;
+            }
+            .chart {
+                width: 100%;
+                height: 300px;
+                background: #eee;
+            }
+        }
+    }
+</style>

From ffe1bb7690a30e756658427751df84b62ab5f1b5 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, 8 Jun 2022 16:56:03 +0800
Subject: [PATCH 04/14] =?UTF-8?q?feat:=20=E6=8E=A5=E5=8F=A3=E5=AF=B9?=
 =?UTF-8?q?=E6=8E=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/store/modules/im/chatHome.js |   2 +-
 src/views/im/home/index.vue      | 122 ++++++++++++++++++++++++++++---
 2 files changed, 113 insertions(+), 11 deletions(-)

diff --git a/src/store/modules/im/chatHome.js b/src/store/modules/im/chatHome.js
index 81a9909..8f12d1e 100644
--- a/src/store/modules/im/chatHome.js
+++ b/src/store/modules/im/chatHome.js
@@ -15,7 +15,7 @@ const actions = {
     loadOnline: async ({ commit }, data) => {
         let res = await api.online(data);
         commit('setOnline', res || 0);
-        if (!res) {
+        if (!res && res !== 0) {
             ElMessage.error('查询失败');
         }
         return res;
diff --git a/src/views/im/home/index.vue b/src/views/im/home/index.vue
index 125e29f..5029b89 100644
--- a/src/views/im/home/index.vue
+++ b/src/views/im/home/index.vue
@@ -2,7 +2,12 @@
     <div class="home-container">
         <el-form>
             <el-form-item label="所属系统">
-                <el-select v-model="systemId" :config="{ label: 'name', value: 'id' }" :opts="opts.system" />
+                <el-select
+                    v-model="systemId"
+                    :clearable="false"
+                    :config="{ label: 'name', value: 'id' }"
+                    :opts="opts.system"
+                />
             </el-form-item>
         </el-form>
         <el-card header="在线人数">{{ online }}</el-card>
@@ -33,6 +38,8 @@
 </template>
 
 <script setup>
+    import dayjs from 'dayjs';
+    import * as echarts from 'echarts';
     const store = useStore();
     const loading = ref(false);
     const opts = computed(() => store.state.chatStore.opts);
@@ -60,9 +67,64 @@
     };
     watch(systemId, handleLoadOnline);
 
-    const date1 = ref(null);
+    const handleChart = (selector, name, data) => {
+        const chart = echarts.init(document.querySelector(selector));
+        const option = {
+            gradientColor: ['#1DE7FF', '#249AFF', '#6F41FA', '#6F41FA'],
+            visualMap: [
+                {
+                    show: false,
+                    type: 'continuous',
+                    dimension: 0,
+                    min: 0,
+                    max: data.length - 1,
+                },
+            ],
+            tooltip: {
+                trigger: 'axis',
+            },
+            grid: {
+                left: '0',
+                right: '0',
+                top: '5%',
+                bottom: '0',
+                containLabel: true,
+            },
+            xAxis: [
+                {
+                    data: data.map((item) => item.label),
+                },
+            ],
+            yAxis: [{}],
+            series: [
+                {
+                    type: 'line',
+                    name,
+                    showSymbol: false,
+                    smooth: true,
+                    areaStyle: {
+                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                            {
+                                offset: 0,
+                                color: 'rgba(29, 231, 255, 0.3)',
+                            },
+                            {
+                                offset: 1,
+                                color: 'rgba(29, 231, 255, 0)',
+                            },
+                        ]),
+                    },
+                    data: data.map((item) => item.value),
+                },
+            ],
+        };
+        chart.setOption(option);
+    };
+
+    const date1 = ref(dayjs(new Date()).format('YYYY-MM-DD'));
     const handleLoadSingle = async () => {
         loading.value = true;
+        store.commit('chatHome/setSingle', []);
         if (unref(systemId)) {
             if (unref(date1)) {
                 await store.dispatch('chatHome/loadSingle', {
@@ -70,17 +132,37 @@
                     start: new Date(unref(date1) + ' 00:00:00').getTime(),
                     end: new Date(unref(date1) + ' 23:59:59').getTime(),
                 });
-            } else {
-                store.commit('setSingle', []);
             }
         }
         loading.value = false;
     };
-    watch(date1, handleLoadSingle);
+    watch(date1, handleLoadSingle, { immediate: true });
+    watch(systemId, handleLoadSingle);
+    watch(
+        () => store.state.chatHome.single,
+        (value) => {
+            handleChart(
+                '.chart-1',
+                '消息量',
+                value.map((item) => {
+                    return {
+                        label: item.hours,
+                        value: item.messageCount,
+                    };
+                })
+            );
+        }
+    );
 
-    const date2 = ref([]);
+    const date2 = ref([
+        new Date(
+            dayjs(new Date(Date.now() - ((new Date().getDay() || 7) - 1) * 86400000)).format('YYYY-MM-DD') + ' 00:00:00'
+        ).getTime(),
+        new Date(dayjs(new Date()).format('YYYY-MM-DD') + ' 23:59:59').getTime(),
+    ]);
     const handleLoadRange = async () => {
         loading.value = true;
+        store.commit('chatHome/setRange', []);
         if (unref(systemId)) {
             if (unref(date2)?.length) {
                 await store.dispatch('chatHome/loadRange', {
@@ -88,13 +170,29 @@
                     start: unref(date2)[0],
                     end: unref(date2)[1],
                 });
-            } else {
-                store.commit('setSingle', []);
             }
         }
         loading.value = false;
     };
-    watch(date2, handleLoadRange);
+    watch(date2, handleLoadRange, {
+        immediate: true,
+    });
+    watch(systemId, handleLoadRange);
+    watch(
+        () => store.state.chatHome.range,
+        (value) => {
+            handleChart(
+                '.chart-2',
+                '消息量',
+                value.map((item) => {
+                    return {
+                        label: item.days,
+                        value: item.messageCount,
+                    };
+                })
+            );
+        }
+    );
 
     onActivated(() => {
         handleLoadOnline();
@@ -116,10 +214,14 @@
             & + .el-card {
                 margin-top: 30px;
             }
+            &:nth-of-type(1) {
+                :deep(.el-card__body) {
+                    font-size: 32px;
+                }
+            }
             .chart {
                 width: 100%;
                 height: 300px;
-                background: #eee;
             }
         }
     }

From 7a98d65a36c0d2e9704775ce1de7356376555d6f 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, 8 Jun 2022 17:29:15 +0800
Subject: [PATCH 05/14] perf: resize

---
 src/views/im/home/index.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/views/im/home/index.vue b/src/views/im/home/index.vue
index 5029b89..e310781 100644
--- a/src/views/im/home/index.vue
+++ b/src/views/im/home/index.vue
@@ -69,6 +69,7 @@
 
     const handleChart = (selector, name, data) => {
         const chart = echarts.init(document.querySelector(selector));
+        window.addEventListener('resize', () => nextTick(() => chart.resize()));
         const option = {
             gradientColor: ['#1DE7FF', '#249AFF', '#6F41FA', '#6F41FA'],
             visualMap: [

From 2cfe2f366d31d8781a0e34e727d3a73a6111deb3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=91=E6=96=87=E5=8F=AF?= <1041367524@qq.com>
Date: Thu, 9 Jun 2022 14:58:17 +0800
Subject: [PATCH 06/14] =?UTF-8?q?fix:=20=E6=89=B9=E9=87=8F=E5=88=A0?=
 =?UTF-8?q?=E9=99=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/im/store/index.vue  | 4 ++++
 src/views/im/system/index.vue | 4 ++++
 src/views/im/waiter/index.vue | 4 ++++
 vite.config.js                | 4 ++--
 4 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/src/views/im/store/index.vue b/src/views/im/store/index.vue
index cf7cf76..28d6238 100644
--- a/src/views/im/store/index.vue
+++ b/src/views/im/store/index.vue
@@ -163,6 +163,10 @@
     const config = reactive({
         // 表格列配置
         columns: [
+            {
+                type: 'selection',
+                width: 60,
+            },
             {
                 label: '所属系统',
                 width: 160,
diff --git a/src/views/im/system/index.vue b/src/views/im/system/index.vue
index ec1496a..9299b26 100644
--- a/src/views/im/system/index.vue
+++ b/src/views/im/system/index.vue
@@ -130,6 +130,10 @@
     const config = reactive({
         // 表格列配置
         columns: [
+            {
+                type: 'selection',
+                width: 60,
+            },
             {
                 label: '系统标识',
                 prop: 'client',
diff --git a/src/views/im/waiter/index.vue b/src/views/im/waiter/index.vue
index 9eb27fb..67087e8 100644
--- a/src/views/im/waiter/index.vue
+++ b/src/views/im/waiter/index.vue
@@ -194,6 +194,10 @@
     const config = reactive({
         // 表格列配置
         columns: [
+            {
+                type: 'selection',
+                width: 60,
+            },
             {
                 label: '所属店铺',
                 width: 160,
diff --git a/vite.config.js b/vite.config.js
index e61b7e3..6e19788 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -23,9 +23,9 @@ export default (configEnv) => {
                     // target: 'http://192.168.10.109:8090/', // 显雨
                     // target: 'http://192.168.10.5:4500', // 高玉
                     // target: 'http://192.168.10.67:8090', // 罗战
-                    target: 'http://192.168.10.94:8090', // 周渺
+                    // target: 'http://192.168.10.94:8090', // 周渺
                     // target: 'http://192.168.10.124:8090', // 舒梦娇
-                    // target: 'https://k8s-horse-gateway.mashibing.cn/', // 测试地址
+                    target: 'https://k8s-horse-gateway.mashibing.cn/', // 测试地址
                     // target: 'https://you-gateway.mashibing.com', // 生产环境
                     changeOrigin: true,
                     rewrite: (path) => path.replace(/^\/api/, ''),

From 998d04a9357e13cced626ff938444952e2d0ddff Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=91=E6=96=87=E5=8F=AF?= <1041367524@qq.com>
Date: Thu, 9 Jun 2022 15:26:01 +0800
Subject: [PATCH 07/14] =?UTF-8?q?fix:=20=E8=BE=93=E5=85=A5=E6=A1=86?=
 =?UTF-8?q?=E9=95=BF=E5=BA=A6=E9=99=90=E5=88=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/im/store/index.vue  | 4 ++--
 src/views/im/system/index.vue | 6 +++---
 src/views/im/waiter/index.vue | 8 ++++----
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/views/im/store/index.vue b/src/views/im/store/index.vue
index 28d6238..508f7ce 100644
--- a/src/views/im/store/index.vue
+++ b/src/views/im/store/index.vue
@@ -25,7 +25,7 @@
                 </el-form>
             </template>
         </table-list>
-        <el-dialog v-model="formState.formVisible" :title="formState.form.id ? '编辑' : '添加' + '店铺'">
+        <el-dialog v-model="formState.formVisible" :title="formState.form.id ? '编辑' : '添加' + '店铺'" width="480px">
             <el-form
                 ref="refsForm"
                 v-loading="formState.submitting"
@@ -45,7 +45,7 @@
                     <el-upload-image v-model="formState.form.avatar" config-id="im/" />
                 </el-form-item>
                 <el-form-item label="店铺名称" prop="name">
-                    <el-input v-model="formState.form.name" />
+                    <el-input v-model="formState.form.name" maxlength="20" />
                 </el-form-item>
             </el-form>
             <template #footer>
diff --git a/src/views/im/system/index.vue b/src/views/im/system/index.vue
index 9299b26..1a788c7 100644
--- a/src/views/im/system/index.vue
+++ b/src/views/im/system/index.vue
@@ -13,7 +13,7 @@
             @remove="handleRemove"
             @search="handleSearch"
         />
-        <el-dialog v-model="formState.formVisible" :title="formState.form.id ? '查看' : '添加' + '系统'">
+        <el-dialog v-model="formState.formVisible" :title="formState.form.id ? '查看' : '添加' + '系统'" width="480px">
             <el-form
                 ref="refsForm"
                 v-loading="formState.submitting"
@@ -23,10 +23,10 @@
                 :rules="formState.rules"
             >
                 <el-form-item label="系统标识" prop="client">
-                    <el-input v-model="formState.form.client" />
+                    <el-input v-model="formState.form.client" maxlength="20" />
                 </el-form-item>
                 <el-form-item label="系统名称" prop="name">
-                    <el-input v-model="formState.form.name" />
+                    <el-input v-model="formState.form.name" maxlength="20" />
                 </el-form-item>
             </el-form>
             <template #footer>
diff --git a/src/views/im/waiter/index.vue b/src/views/im/waiter/index.vue
index 67087e8..09cbf92 100644
--- a/src/views/im/waiter/index.vue
+++ b/src/views/im/waiter/index.vue
@@ -31,7 +31,7 @@
                 </el-form>
             </template>
         </table-list>
-        <el-dialog v-model="formState.formVisible" :title="formState.form.id ? '编辑' : '添加' + '店铺'">
+        <el-dialog v-model="formState.formVisible" :title="formState.form.id ? '编辑' : '添加' + '店铺'" width="480px">
             <el-form
                 ref="refsForm"
                 v-loading="formState.submitting"
@@ -48,16 +48,16 @@
                     />
                 </el-form-item>
                 <el-form-item label="客服类型" prop="type">
-                    <el-input v-model="formState.form.type" />
+                    <el-input v-model="formState.form.type" maxlength="20" />
                 </el-form-item>
                 <el-form-item label="客服头像" prop="waiterAvatar">
                     <el-upload-image v-model="formState.form.waiterAvatar" config-id="im/" />
                 </el-form-item>
                 <el-form-item label="客服ID" prop="waiterId">
-                    <el-input v-model="formState.form.waiterId" :disabled="!!formState.form.id" />
+                    <el-input v-model="formState.form.waiterId" :disabled="!!formState.form.id" maxlength="20" />
                 </el-form-item>
                 <el-form-item label="客服昵称" prop="waiterNickname">
-                    <el-input v-model="formState.form.waiterNickname" />
+                    <el-input v-model="formState.form.waiterNickname" maxlength="20" />
                 </el-form-item>
             </el-form>
             <template #footer>

From 14cc7175380476170accda0cdaf5ff7df5565796 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=91=E6=96=87=E5=8F=AF?= <1041367524@qq.com>
Date: Thu, 9 Jun 2022 15:37:18 +0800
Subject: [PATCH 08/14] fix: BUG

---
 src/views/im/home/dateRange.vue | 91 +++++++++++++++++++++++++++++++++
 src/views/im/home/index.vue     | 20 ++------
 src/views/im/system/index.vue   | 16 ++++--
 3 files changed, 107 insertions(+), 20 deletions(-)
 create mode 100644 src/views/im/home/dateRange.vue

diff --git a/src/views/im/home/dateRange.vue b/src/views/im/home/dateRange.vue
new file mode 100644
index 0000000..886f2c1
--- /dev/null
+++ b/src/views/im/home/dateRange.vue
@@ -0,0 +1,91 @@
+<template>
+    <div class="date-range">
+        <el-button
+            v-for="(item, index) in opts"
+            :key="index"
+            :class="{ active: active === item.value }"
+            type="text"
+            @click="handleRange(item.value)"
+        >
+            {{ item.label }}
+        </el-button>
+        <el-date-picker
+            v-model="value"
+            :clearable="false"
+            :default-time="[new Date(0, 0, 0, 0, 0, 0), new Date(0, 0, 0, 23, 59, 59)]"
+            type="datetimerange"
+            value-format="x"
+        />
+    </div>
+</template>
+
+<script setup>
+    import dayjs from 'dayjs';
+    const opts = ref([
+        {
+            label: '本周',
+            value: 'week',
+        },
+        {
+            label: '本月',
+            value: 'month',
+        },
+    ]);
+    const active = ref('week');
+    const value = ref([]);
+    const emits = defineEmits(['update:modelValue']);
+    watch(value, (value) => {
+        emits('update:modelValue', value);
+        if (unref(click)) {
+            click.value = false;
+        } else {
+            active.value = null;
+        }
+    });
+    const click = ref(false);
+    const handleRange = (range) => {
+        click.value = true;
+        active.value = range;
+        let weekStart = new Date(new Date().getTime() - ((new Date().getDay() || 7) - 1) * 1000 * 60 * 60 * 24);
+        switch (range) {
+            case 'week':
+                value.value = [
+                    new Date(dayjs(weekStart).format('YYYY-MM-DD 00:00:00')).getTime(),
+                    new Date(
+                        dayjs(new Date(weekStart.getTime() + 6 * 1000 * 60 * 60 * 24)).format('YYYY-MM-DD 23:59:59')
+                    ).getTime(),
+                ];
+                break;
+            case 'month':
+                value.value = [
+                    new Date(
+                        dayjs(new Date(new Date().getTime() - (new Date().getDate() - 1) * 1000 * 60 * 60 * 24)).format(
+                            'YYYY-MM-DD 00:00:00'
+                        )
+                    ).getTime(),
+                    new Date(dayjs(new Date()).format('YYYY-MM-DD 23:59:59')).getTime(),
+                ];
+                break;
+        }
+    };
+    handleRange('week');
+</script>
+
+<style lang="less" scoped>
+    .date-range {
+        display: flex;
+        align-items: center;
+        .el-button {
+            color: #666;
+            &.active {
+                color: #4481ff;
+            }
+            & + .el-button {
+                margin-left: 44px;
+            }
+        }
+        :deep(.el-date-editor) {
+            margin-left: 44px;
+        }
+    }
+</style>
diff --git a/src/views/im/home/index.vue b/src/views/im/home/index.vue
index e310781..007a3a6 100644
--- a/src/views/im/home/index.vue
+++ b/src/views/im/home/index.vue
@@ -24,12 +24,7 @@
             <template #header>
                 <div class="flex">
                     <p>历史消息量</p>
-                    <el-date-picker
-                        v-model="date2"
-                        :default-time="[new Date(0, 0, 0, 0, 0, 0), new Date(0, 0, 0, 23, 59, 59)]"
-                        type="datetimerange"
-                        value-format="x"
-                    />
+                    <date-range v-model="date2" />
                 </div>
             </template>
             <div class="chart chart-2"></div>
@@ -40,6 +35,7 @@
 <script setup>
     import dayjs from 'dayjs';
     import * as echarts from 'echarts';
+    import DateRange from './dateRange.vue';
     const store = useStore();
     const loading = ref(false);
     const opts = computed(() => store.state.chatStore.opts);
@@ -155,12 +151,7 @@
         }
     );
 
-    const date2 = ref([
-        new Date(
-            dayjs(new Date(Date.now() - ((new Date().getDay() || 7) - 1) * 86400000)).format('YYYY-MM-DD') + ' 00:00:00'
-        ).getTime(),
-        new Date(dayjs(new Date()).format('YYYY-MM-DD') + ' 23:59:59').getTime(),
-    ]);
+    const date2 = ref([]);
     const handleLoadRange = async () => {
         loading.value = true;
         store.commit('chatHome/setRange', []);
@@ -175,9 +166,7 @@
         }
         loading.value = false;
     };
-    watch(date2, handleLoadRange, {
-        immediate: true,
-    });
+    watch(date2, handleLoadRange);
     watch(systemId, handleLoadRange);
     watch(
         () => store.state.chatHome.range,
@@ -207,6 +196,7 @@
         .flex {
             display: flex;
             align-items: center;
+            justify-content: space-between;
             p {
                 margin-right: 20px;
             }
diff --git a/src/views/im/system/index.vue b/src/views/im/system/index.vue
index 1a788c7..3f1f30e 100644
--- a/src/views/im/system/index.vue
+++ b/src/views/im/system/index.vue
@@ -12,7 +12,15 @@
             @create="handleCreate()"
             @remove="handleRemove"
             @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>
+            </template>
+        </table-list>
         <el-dialog v-model="formState.formVisible" :title="formState.form.id ? '查看' : '添加' + '系统'" width="480px">
             <el-form
                 ref="refsForm"
@@ -54,8 +62,7 @@
     }
     const state = reactive({
         condition: {
-            title: null,
-            dateRange: [],
+            name: null,
         },
     });
     watch(
@@ -67,8 +74,7 @@
     );
     const handleReset = () => {
         state.condition = {
-            title: null,
-            dateRange: [],
+            name: null,
         };
     };
     const handleSearch = async () => {

From eb1edf8b21a189de03957c6a713e4eca01c7c255 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=91=E6=96=87=E5=8F=AF?= <1041367524@qq.com>
Date: Thu, 9 Jun 2022 15:54:06 +0800
Subject: [PATCH 09/14] =?UTF-8?q?fix:=20=E5=AE=A2=E6=9C=8D=E9=87=8D?=
 =?UTF-8?q?=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/im/waiter/index.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/views/im/waiter/index.vue b/src/views/im/waiter/index.vue
index 09cbf92..08614ff 100644
--- a/src/views/im/waiter/index.vue
+++ b/src/views/im/waiter/index.vue
@@ -91,7 +91,7 @@
     });
     const handleReset = () => {
         state.condition = {
-            storeId: null,
+            storeId: unref(opts).store?.[0]?.id,
             waiterId: null,
             waiterNickname: null,
         };
@@ -101,6 +101,9 @@
             loading.value = true;
             await store.dispatch('chatWaiter/search');
             loading.value = false;
+        } else {
+            store.commit('chatWaiter/setList', []);
+            store.commit('chatWaiter/setTotal', 0);
         }
     };
     watch(

From c5edad675c3d124791467bb729c1464d1c0cee9e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=91=E6=96=87=E5=8F=AF?= <1041367524@qq.com>
Date: Thu, 9 Jun 2022 17:57:11 +0800
Subject: [PATCH 10/14] =?UTF-8?q?fix:=20=E7=BB=9F=E8=AE=A1=E6=8E=A5?=
 =?UTF-8?q?=E5=8F=A3=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/im/home/index.vue | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/views/im/home/index.vue b/src/views/im/home/index.vue
index 007a3a6..6ac6882 100644
--- a/src/views/im/home/index.vue
+++ b/src/views/im/home/index.vue
@@ -15,7 +15,12 @@
             <template #header>
                 <div class="flex">
                     <p>单日消息量</p>
-                    <el-date-picker v-model="date1" type="date" value-format="YYYY-MM-DD" />
+                    <el-date-picker
+                        v-model="date1"
+                        :disabled-date="(date) => date.getTime() > Date.now()"
+                        type="date"
+                        value-format="YYYY-MM-DD"
+                    />
                 </div>
             </template>
             <div class="chart chart-1"></div>
@@ -126,8 +131,7 @@
             if (unref(date1)) {
                 await store.dispatch('chatHome/loadSingle', {
                     systemId: unref(systemId),
-                    start: new Date(unref(date1) + ' 00:00:00').getTime(),
-                    end: new Date(unref(date1) + ' 23:59:59').getTime(),
+                    days: unref(date1),
                 });
             }
         }

From 75c772b63afe15c890ccaf11e392e08806970d2e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=91=E6=96=87=E5=8F=AF?= <1041367524@qq.com>
Date: Thu, 9 Jun 2022 18:09:06 +0800
Subject: [PATCH 11/14] =?UTF-8?q?perf:=20=E5=9B=BE=E8=A1=A8=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/im/home/index.vue | 67 ++++++++++++++++++++-----------------
 1 file changed, 37 insertions(+), 30 deletions(-)

diff --git a/src/views/im/home/index.vue b/src/views/im/home/index.vue
index 6ac6882..4fb3007 100644
--- a/src/views/im/home/index.vue
+++ b/src/views/im/home/index.vue
@@ -68,9 +68,18 @@
     };
     watch(systemId, handleLoadOnline);
 
+    const charts = ref({});
+    window.addEventListener('resize', () =>
+        setTimeout(() => {
+            Object.entries(unref(charts)).forEach((entry) => {
+                entry[1].resize();
+            });
+        }, 100)
+    );
     const handleChart = (selector, name, data) => {
-        const chart = echarts.init(document.querySelector(selector));
-        window.addEventListener('resize', () => nextTick(() => chart.resize()));
+        let chart = charts.value[selector];
+        chart?.dispose();
+        chart = charts.value[selector] = echarts.init(document.querySelector(selector));
         const option = {
             gradientColor: ['#1DE7FF', '#249AFF', '#6F41FA', '#6F41FA'],
             visualMap: [
@@ -88,37 +97,35 @@
             grid: {
                 left: '0',
                 right: '0',
-                top: '5%',
-                bottom: '0',
+                bottom: '30px',
+                top: '60px',
                 containLabel: true,
             },
-            xAxis: [
-                {
-                    data: data.map((item) => item.label),
-                },
-            ],
-            yAxis: [{}],
-            series: [
-                {
-                    type: 'line',
-                    name,
-                    showSymbol: false,
-                    smooth: true,
-                    areaStyle: {
-                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                            {
-                                offset: 0,
-                                color: 'rgba(29, 231, 255, 0.3)',
-                            },
-                            {
-                                offset: 1,
-                                color: 'rgba(29, 231, 255, 0)',
-                            },
-                        ]),
-                    },
-                    data: data.map((item) => item.value),
+            xAxis: {
+                data: data.map((item) => item.label),
+            },
+            yAxis: {
+                minInterval: 1,
+            },
+            series: {
+                type: 'line',
+                name,
+                showSymbol: false,
+                smooth: true,
+                areaStyle: {
+                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                        {
+                            offset: 0,
+                            color: 'rgba(29, 231, 255, 0.3)',
+                        },
+                        {
+                            offset: 1,
+                            color: 'rgba(29, 231, 255, 0)',
+                        },
+                    ]),
                 },
-            ],
+                data: data.map((item) => item.value),
+            },
         };
         chart.setOption(option);
     };

From 73f473216b7a3aaa7303a8f5020735d326da23e6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=91=E6=96=87=E5=8F=AF?= <1041367524@qq.com>
Date: Thu, 9 Jun 2022 18:15:54 +0800
Subject: [PATCH 12/14] fix: BUG

---
 src/views/im/home/index.vue | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/views/im/home/index.vue b/src/views/im/home/index.vue
index 4fb3007..43f1998 100644
--- a/src/views/im/home/index.vue
+++ b/src/views/im/home/index.vue
@@ -76,7 +76,13 @@
             });
         }, 100)
     );
-    const handleChart = (selector, name, data) => {
+    const handleChart = (
+        selector,
+        name,
+        data,
+        formatter = (params) =>
+            `${params[0].axisValue}<br/><span style="color:${params[0].color};font-size:20px;margin-right:5px;">●</span>${params[0].seriesName}<b style="margin-left:10px;">${params[0].value}</b>`
+    ) => {
         let chart = charts.value[selector];
         chart?.dispose();
         chart = charts.value[selector] = echarts.init(document.querySelector(selector));
@@ -93,6 +99,7 @@
             ],
             tooltip: {
                 trigger: 'axis',
+                formatter,
             },
             grid: {
                 left: '0',
@@ -157,7 +164,9 @@
                         label: item.hours,
                         value: item.messageCount,
                     };
-                })
+                }),
+                (params) =>
+                    `${params[0].axisValue}:00 - ${params[0].axisValue}:59<br/><span style="color:${params[0].color};font-size:20px;margin-right:5px;">●</span>${params[0].seriesName}<b style="margin-left:10px;">${params[0].value}</b>`
             );
         }
     );

From 66018c607a1abec63955211cc866092f99e59bbe 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, 13 Jun 2022 10:01:23 +0800
Subject: [PATCH 13/14] refactor: im

---
 src/store/modules/{im => chat}/chatWaiter.js  |   0
 src/store/modules/chat/customerService.js     |  91 -------
 .../modules/im/{chatHome.js => imHome.js}     |   0
 .../modules/im/{chatStore.js => imStore.js}   |   2 +-
 .../modules/im/{chatSystem.js => imSystem.js} |   2 +-
 src/store/modules/im/{im.js => imWaiter.js}   |  29 +-
 src/views/chat/waiter.vue                     | 247 ++++++++++++++++++
 src/views/im/home/index.vue                   |  20 +-
 src/views/im/store/index.vue                  |  18 +-
 src/views/im/system/index.vue                 |  18 +-
 src/views/im/waiter/index.vue                 |  44 +---
 11 files changed, 302 insertions(+), 169 deletions(-)
 rename src/store/modules/{im => chat}/chatWaiter.js (100%)
 delete mode 100644 src/store/modules/chat/customerService.js
 rename src/store/modules/im/{chatHome.js => imHome.js} (100%)
 rename src/store/modules/im/{chatStore.js => imStore.js} (99%)
 rename src/store/modules/im/{chatSystem.js => imSystem.js} (98%)
 rename src/store/modules/im/{im.js => imWaiter.js} (71%)
 create mode 100644 src/views/chat/waiter.vue

diff --git a/src/store/modules/im/chatWaiter.js b/src/store/modules/chat/chatWaiter.js
similarity index 100%
rename from src/store/modules/im/chatWaiter.js
rename to src/store/modules/chat/chatWaiter.js
diff --git a/src/store/modules/chat/customerService.js b/src/store/modules/chat/customerService.js
deleted file mode 100644
index 50de3ee..0000000
--- a/src/store/modules/chat/customerService.js
+++ /dev/null
@@ -1,91 +0,0 @@
-import * as api from '@/api/chat/index.js';
-import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
-const state = () => ({
-    code: 'CustomerServiceManagement',
-    condition: {},
-    list: [],
-    total: 0,
-    opts: {
-        init: false,
-        customerServiceType: [
-            {
-                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),
-    setOpts: (state, data) => (state.opts = data),
-};
-const actions = {
-    search: async ({ commit }) => {
-        let res = await api.searchService(1);
-        commit('setList', res || []);
-        if (!res) {
-            ElMessage.error('查询失败');
-        }
-        return res;
-    },
-    load: async ({ state, commit }) => {
-        commit('setOpts', {
-            ...state.opts,
-            init: true,
-        });
-    },
-    detail: async (context, id) => {
-        let res = await api.detail(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;
-    },
-    remove: async ({ dispatch }, idList) => {
-        if (!idList.length) {
-            ElMessage.warning('请选择要删除的数据');
-        } else {
-            try {
-                await ElMessageBox.confirm('数据删除后无法恢复，确定要删除吗?', '危险操作');
-                let res = await api.remove(idList.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/im/chatHome.js b/src/store/modules/im/imHome.js
similarity index 100%
rename from src/store/modules/im/chatHome.js
rename to src/store/modules/im/imHome.js
diff --git a/src/store/modules/im/chatStore.js b/src/store/modules/im/imStore.js
similarity index 99%
rename from src/store/modules/im/chatStore.js
rename to src/store/modules/im/imStore.js
index 48528f4..41523a8 100644
--- a/src/store/modules/im/chatStore.js
+++ b/src/store/modules/im/imStore.js
@@ -1,7 +1,7 @@
 import * as api from '@/api/im/index.js';
 import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
 const state = () => ({
-    code: 'ChatStore',
+    code: 'ImStore',
     condition: {},
     list: [],
     total: 0,
diff --git a/src/store/modules/im/chatSystem.js b/src/store/modules/im/imSystem.js
similarity index 98%
rename from src/store/modules/im/chatSystem.js
rename to src/store/modules/im/imSystem.js
index 7bc9559..c2ddf62 100644
--- a/src/store/modules/im/chatSystem.js
+++ b/src/store/modules/im/imSystem.js
@@ -1,7 +1,7 @@
 import * as api from '@/api/im/index.js';
 import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
 const state = () => ({
-    code: 'ChatSystem',
+    code: 'ImSystem',
     condition: {},
     list: [],
     total: 0,
diff --git a/src/store/modules/im/im.js b/src/store/modules/im/imWaiter.js
similarity index 71%
rename from src/store/modules/im/im.js
rename to src/store/modules/im/imWaiter.js
index 535c033..824f28c 100644
--- a/src/store/modules/im/im.js
+++ b/src/store/modules/im/imWaiter.js
@@ -1,12 +1,13 @@
-import * as api from '@/api/system/notify.js';
+import * as api from '@/api/im/index.js';
 import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
 const state = () => ({
-    code: 'NotifyManagement',
+    code: 'ImWaiter',
     condition: {},
     list: [],
     total: 0,
     opts: {
         init: false,
+        store: [],
     },
 });
 const getters = {};
@@ -20,10 +21,7 @@ const mutations = {
 const actions = {
     search: async ({ state, commit, rootGetters }) => {
         let data = { ...state.condition };
-        data.startReleaseTime = data.dateRange?.[0];
-        data.endReleaseTime = data.dateRange?.[1];
-        delete data.dateRange;
-        let res = await api.search({ ...rootGetters['local/page'](state.code), ...state.condition });
+        let res = await api.searchWaiter({ ...rootGetters['local/page'](state.code), ...data });
         if (res) {
             commit('setList', res.records);
             commit('setTotal', res.total);
@@ -36,17 +34,14 @@ const actions = {
     load: async ({ commit }) => {
         commit('setOpts', {
             init: true,
+            store: (await api.searchStore({ pageIndex: 1, length: 9999 }))?.records || [],
         });
     },
-    detail: async (context, id) => {
-        let res = await api.detail(id);
-        if (!res) {
-            ElMessage.error('加载详情失败');
+    save: async ({ state, dispatch }, data) => {
+        if (data.id) {
+            data.systemId = state.condition.systemid;
         }
-        return res;
-    },
-    save: async ({ dispatch }, data) => {
-        let save = data.id ? api.update : api.create;
+        let save = data.id ? api.updateWaiter : api.createWaiter;
         let res = await save(data);
         if (res) {
             ElMessage.success('保存成功');
@@ -56,13 +51,13 @@ const actions = {
         }
         return res;
     },
-    remove: async ({ dispatch }, idList) => {
-        if (!idList.length) {
+    remove: async ({ dispatch }, data) => {
+        if (!data.waiterIds.length) {
             ElMessage.warning('请选择要删除的数据');
         } else {
             try {
                 await ElMessageBox.confirm('数据删除后无法恢复，确定要删除吗?', '危险操作');
-                let res = await api.remove(idList.join(','));
+                let res = await api.removeWaiter(data);
                 if (res) {
                     ElMessage.success('删除成功');
                     dispatch('search');
diff --git a/src/views/chat/waiter.vue b/src/views/chat/waiter.vue
new file mode 100644
index 0000000..08614ff
--- /dev/null
+++ b/src/views/chat/waiter.vue
@@ -0,0 +1,247 @@
+<template>
+    <div class="list-container">
+        <table-list
+            v-loading="loading"
+            :code="code"
+            :config="config"
+            :data="list"
+            :operation="['create', 'search', 'remove']"
+            :reset="handleReset"
+            title="客服"
+            :total="total"
+            @create="handleCreate()"
+            @remove="handleRemove"
+            @search="handleSearch"
+        >
+            <template #search>
+                <el-form inline>
+                    <el-form-item label="所属店铺" prop="storeId">
+                        <el-select
+                            v-model="state.condition.storeId"
+                            :config="{ label: 'name', value: 'id' }"
+                            :opts="opts.store"
+                        />
+                    </el-form-item>
+                    <el-form-item label="客服ID" prop="waiterId">
+                        <el-input v-model="state.condition.waiterId" />
+                    </el-form-item>
+                    <el-form-item label="客服昵称" prop="waiterNickname">
+                        <el-input v-model="state.condition.waiterNickname" />
+                    </el-form-item>
+                </el-form>
+            </template>
+        </table-list>
+        <el-dialog v-model="formState.formVisible" :title="formState.form.id ? '编辑' : '添加' + '店铺'" width="480px">
+            <el-form
+                ref="refsForm"
+                v-loading="formState.submitting"
+                label-width="100px"
+                :model="formState.form"
+                :rules="formState.rules"
+            >
+                <el-form-item label="所属店铺" prop="storeId">
+                    <el-select
+                        v-model="formState.form.storeId"
+                        :config="{ label: 'name', value: 'id' }"
+                        :disabled="formState.form.id"
+                        :opts="opts.store"
+                    />
+                </el-form-item>
+                <el-form-item label="客服类型" prop="type">
+                    <el-input v-model="formState.form.type" maxlength="20" />
+                </el-form-item>
+                <el-form-item label="客服头像" prop="waiterAvatar">
+                    <el-upload-image v-model="formState.form.waiterAvatar" config-id="im/" />
+                </el-form-item>
+                <el-form-item label="客服ID" prop="waiterId">
+                    <el-input v-model="formState.form.waiterId" :disabled="!!formState.form.id" maxlength="20" />
+                </el-form-item>
+                <el-form-item label="客服昵称" prop="waiterNickname">
+                    <el-input v-model="formState.form.waiterNickname" maxlength="20" />
+                </el-form-item>
+            </el-form>
+            <template #footer>
+                <el-button @click="formState.formVisible = false">取消</el-button>
+                <el-button :loading="formState.submitting" type="primary" @click="handleSave">保存</el-button>
+            </template>
+        </el-dialog>
+    </div>
+</template>
+
+<script setup lang="jsx">
+    import ElButton from '@/components/extra/ElButton.vue';
+    import ElImage from '@/components/extra/ElImage.vue';
+    const store = useStore();
+    const route = useRoute();
+    const { proxy } = getCurrentInstance();
+    const loading = ref(false);
+    const code = computed(() => store.state.chatWaiter.code);
+    const list = computed(() => store.state.chatWaiter.list);
+    const total = computed(() => store.state.chatWaiter.total);
+    const opts = computed(() => store.state.chatWaiter.opts);
+    if (!unref(opts).init) {
+        store.dispatch('chatWaiter/load');
+    }
+    const state = reactive({
+        condition: {
+            storeId: null,
+            waiterId: null,
+            waiterNickname: null,
+        },
+    });
+    const handleReset = () => {
+        state.condition = {
+            storeId: unref(opts).store?.[0]?.id,
+            waiterId: null,
+            waiterNickname: null,
+        };
+    };
+    const handleSearch = async () => {
+        if (state.condition.storeId) {
+            loading.value = true;
+            await store.dispatch('chatWaiter/search');
+            loading.value = false;
+        } else {
+            store.commit('chatWaiter/setList', []);
+            store.commit('chatWaiter/setTotal', 0);
+        }
+    };
+    watch(
+        () => unref(opts).store,
+        (value) => {
+            if (!state.condition.storeId) {
+                state.condition.storeId = value[0]?.id;
+            }
+        }
+    );
+    watch(
+        () => state.condition,
+        (value) => {
+            store.commit('chatWaiter/setCondition', _.cloneDeep(value));
+        },
+        { immediate: true, deep: true }
+    );
+    watch(
+        () => state.condition.storeId,
+        () => {
+            handleSearch();
+        }
+    );
+    onActivated(() => {
+        let storeId = route.query.storeId;
+        if (storeId) {
+            state.condition.storeId = +storeId;
+        } else {
+            handleSearch();
+        }
+    });
+
+    /* 表单 */
+    const refsForm = ref(null);
+    const formState = reactive({
+        formVisible: false,
+        submitting: false,
+        form: {
+            id: null,
+            storeId: null,
+            type: null,
+            waiterAvatar: null,
+            waiterId: null,
+            waiterNickname: null,
+        },
+        rules: {
+            storeId: [{ required: true, message: '所属店铺不能为空' }],
+            type: [{ required: true, message: '客服类型不能为空' }],
+            waiterAvatar: [{ required: true, message: '客服头像不能为空' }],
+            waiterId: [{ required: true, message: '客服ID不能为空' }],
+            waiterNickname: [{ required: true, message: '客服昵称不能为空' }],
+        },
+    });
+    // 添加/编辑
+    const handleCreate = (row) => {
+        Object.assign(
+            formState.form,
+            row || {
+                id: null,
+                storeId: null,
+                type: null,
+                waiterAvatar: null,
+                waiterId: null,
+                waiterNickname: null,
+            }
+        );
+        if (!formState.form.storeId) {
+            formState.form.storeId = state.condition.storeId;
+        }
+        formState.formVisible = true;
+    };
+    // 保存
+    const handleSave = async () => {
+        formState.submitting = true;
+        try {
+            await proxy.$validate(refsForm);
+            let data = _.cloneDeep(formState.form);
+            await store.dispatch('chatWaiter/save', data);
+            formState.formVisible = false;
+        } catch (e) {
+            console.info('取消保存', e);
+        }
+        formState.submitting = false;
+    };
+    const handleRemove = async (rows) => {
+        store.dispatch('chatWaiter/remove', {
+            storeId: state.condition.storeId,
+            waiterIds: rows.map((item) => item.waiterId),
+        });
+    };
+    const config = reactive({
+        // 表格列配置
+        columns: [
+            {
+                type: 'selection',
+                width: 60,
+            },
+            {
+                label: '所属店铺',
+                width: 160,
+                slots: {
+                    default: ({ row }) => proxy.$dict(unref(opts).store, row.storeId, { label: 'name', value: 'id' }),
+                },
+            },
+            {
+                label: '客服头像',
+                width: 160,
+                slots: {
+                    default: ({ row }) => <ElImage src={row.waiterAvatar} alt={row.waiterNickname} />,
+                },
+            },
+            {
+                label: '客服ID',
+                prop: 'waiterId',
+            },
+            {
+                label: '客服昵称',
+                prop: 'waiterNickname',
+            },
+            {
+                label: '操作',
+                fixed: 'right',
+                slots: {
+                    default: ({ row }) => (
+                        <div>
+                            <ElButton type="text" onClick={() => handleCreate(row)}>
+                                编辑
+                            </ElButton>
+                            <ElButton type="text" onClick={() => handleRemove([row])}>
+                                删除
+                            </ElButton>
+                        </div>
+                    ),
+                },
+                width: 120,
+            },
+        ],
+    });
+</script>
+
+<style lang="less" scoped></style>
diff --git a/src/views/im/home/index.vue b/src/views/im/home/index.vue
index 43f1998..1d8d72e 100644
--- a/src/views/im/home/index.vue
+++ b/src/views/im/home/index.vue
@@ -43,9 +43,9 @@
     import DateRange from './dateRange.vue';
     const store = useStore();
     const loading = ref(false);
-    const opts = computed(() => store.state.chatStore.opts);
+    const opts = computed(() => store.state.imStore.opts);
     if (!unref(opts).init) {
-        store.dispatch('chatStore/load');
+        store.dispatch('imStore/load');
     }
 
     const systemId = ref(null);
@@ -58,11 +58,11 @@
         },
         { immediate: true }
     );
-    const online = computed(() => store.state.chatHome.online);
+    const online = computed(() => store.state.imHome.online);
     const handleLoadOnline = async () => {
         loading.value = true;
         if (unref(systemId)) {
-            await store.dispatch('chatHome/loadOnline', { systemId: unref(systemId) });
+            await store.dispatch('imHome/loadOnline', { systemId: unref(systemId) });
         }
         loading.value = false;
     };
@@ -140,10 +140,10 @@
     const date1 = ref(dayjs(new Date()).format('YYYY-MM-DD'));
     const handleLoadSingle = async () => {
         loading.value = true;
-        store.commit('chatHome/setSingle', []);
+        store.commit('imHome/setSingle', []);
         if (unref(systemId)) {
             if (unref(date1)) {
-                await store.dispatch('chatHome/loadSingle', {
+                await store.dispatch('imHome/loadSingle', {
                     systemId: unref(systemId),
                     days: unref(date1),
                 });
@@ -154,7 +154,7 @@
     watch(date1, handleLoadSingle, { immediate: true });
     watch(systemId, handleLoadSingle);
     watch(
-        () => store.state.chatHome.single,
+        () => store.state.imHome.single,
         (value) => {
             handleChart(
                 '.chart-1',
@@ -174,10 +174,10 @@
     const date2 = ref([]);
     const handleLoadRange = async () => {
         loading.value = true;
-        store.commit('chatHome/setRange', []);
+        store.commit('imHome/setRange', []);
         if (unref(systemId)) {
             if (unref(date2)?.length) {
-                await store.dispatch('chatHome/loadRange', {
+                await store.dispatch('imHome/loadRange', {
                     systemId: unref(systemId),
                     start: unref(date2)[0],
                     end: unref(date2)[1],
@@ -189,7 +189,7 @@
     watch(date2, handleLoadRange);
     watch(systemId, handleLoadRange);
     watch(
-        () => store.state.chatHome.range,
+        () => store.state.imHome.range,
         (value) => {
             handleChart(
                 '.chart-2',
diff --git a/src/views/im/store/index.vue b/src/views/im/store/index.vue
index 508f7ce..29bc429 100644
--- a/src/views/im/store/index.vue
+++ b/src/views/im/store/index.vue
@@ -64,12 +64,12 @@
     const router = useRouter();
     const { proxy } = getCurrentInstance();
     const loading = ref(false);
-    const code = computed(() => store.state.chatStore.code);
-    const list = computed(() => store.state.chatStore.list);
-    const total = computed(() => store.state.chatStore.total);
-    const opts = computed(() => store.state.chatStore.opts);
+    const code = computed(() => store.state.imStore.code);
+    const list = computed(() => store.state.imStore.list);
+    const total = computed(() => store.state.imStore.total);
+    const opts = computed(() => store.state.imStore.opts);
     if (!unref(opts).init) {
-        store.dispatch('chatStore/load');
+        store.dispatch('imStore/load');
     }
     const state = reactive({
         condition: {
@@ -83,13 +83,13 @@
     };
     const handleSearch = async () => {
         loading.value = true;
-        await store.dispatch('chatStore/search');
+        await store.dispatch('imStore/search');
         loading.value = false;
     };
     watch(
         () => state.condition,
         (value) => {
-            store.commit('chatStore/setCondition', _.cloneDeep(value));
+            store.commit('imStore/setCondition', _.cloneDeep(value));
             handleSearch();
         },
         { immediate: true, deep: true }
@@ -139,7 +139,7 @@
         try {
             await proxy.$validate(refsForm);
             let data = _.cloneDeep(formState.form);
-            await store.dispatch('chatStore/save', data);
+            await store.dispatch('imStore/save', data);
             formState.formVisible = false;
         } catch (e) {
             console.info('取消保存', e);
@@ -148,7 +148,7 @@
     };
     const handleRemove = async (rows) => {
         store.dispatch(
-            'chatStore/remove',
+            'imStore/remove',
             rows.map((item) => item.id)
         );
     };
diff --git a/src/views/im/system/index.vue b/src/views/im/system/index.vue
index 3f1f30e..c605698 100644
--- a/src/views/im/system/index.vue
+++ b/src/views/im/system/index.vue
@@ -53,12 +53,12 @@
     const router = useRouter();
     const { proxy } = getCurrentInstance();
     const loading = ref(false);
-    const code = computed(() => store.state.chatSystem.code);
-    const list = computed(() => store.state.chatSystem.list);
-    const total = computed(() => store.state.chatSystem.total);
-    const opts = computed(() => store.state.chatSystem.opts);
+    const code = computed(() => store.state.imSystem.code);
+    const list = computed(() => store.state.imSystem.list);
+    const total = computed(() => store.state.imSystem.total);
+    const opts = computed(() => store.state.imSystem.opts);
     if (!unref(opts).init) {
-        store.dispatch('chatSystem/load');
+        store.dispatch('imSystem/load');
     }
     const state = reactive({
         condition: {
@@ -68,7 +68,7 @@
     watch(
         () => state.condition,
         (value) => {
-            store.commit('chatSystem/setCondition', _.cloneDeep(value));
+            store.commit('imSystem/setCondition', _.cloneDeep(value));
         },
         { immediate: true, deep: true }
     );
@@ -79,7 +79,7 @@
     };
     const handleSearch = async () => {
         loading.value = true;
-        await store.dispatch('chatSystem/search');
+        await store.dispatch('imSystem/search');
         loading.value = false;
     };
     onActivated(handleSearch);
@@ -117,7 +117,7 @@
         try {
             await proxy.$validate(refsForm);
             let data = _.cloneDeep(formState.form);
-            await store.dispatch('chatSystem/save', data);
+            await store.dispatch('imSystem/save', data);
             formState.formVisible = false;
         } catch (e) {
             console.info('取消保存', e);
@@ -126,7 +126,7 @@
     };
     const handleRemove = async (rows) => {
         store.dispatch(
-            'chatSystem/remove',
+            'imSystem/remove',
             rows.map((item) => item.id)
         );
     };
diff --git a/src/views/im/waiter/index.vue b/src/views/im/waiter/index.vue
index 08614ff..2cbc990 100644
--- a/src/views/im/waiter/index.vue
+++ b/src/views/im/waiter/index.vue
@@ -5,7 +5,7 @@
             :code="code"
             :config="config"
             :data="list"
-            :operation="['create', 'search', 'remove']"
+            :operation="['search']"
             :reset="handleReset"
             title="客服"
             :total="total"
@@ -31,7 +31,7 @@
                 </el-form>
             </template>
         </table-list>
-        <el-dialog v-model="formState.formVisible" :title="formState.form.id ? '编辑' : '添加' + '店铺'" width="480px">
+        <el-dialog v-model="formState.formVisible" :title="formState.form.id ? '编辑' : '添加' + '客服'" width="480px">
             <el-form
                 ref="refsForm"
                 v-loading="formState.submitting"
@@ -69,18 +69,17 @@
 </template>
 
 <script setup lang="jsx">
-    import ElButton from '@/components/extra/ElButton.vue';
     import ElImage from '@/components/extra/ElImage.vue';
     const store = useStore();
     const route = useRoute();
     const { proxy } = getCurrentInstance();
     const loading = ref(false);
-    const code = computed(() => store.state.chatWaiter.code);
-    const list = computed(() => store.state.chatWaiter.list);
-    const total = computed(() => store.state.chatWaiter.total);
-    const opts = computed(() => store.state.chatWaiter.opts);
+    const code = computed(() => store.state.imWaiter.code);
+    const list = computed(() => store.state.imWaiter.list);
+    const total = computed(() => store.state.imWaiter.total);
+    const opts = computed(() => store.state.imWaiter.opts);
     if (!unref(opts).init) {
-        store.dispatch('chatWaiter/load');
+        store.dispatch('imWaiter/load');
     }
     const state = reactive({
         condition: {
@@ -99,11 +98,11 @@
     const handleSearch = async () => {
         if (state.condition.storeId) {
             loading.value = true;
-            await store.dispatch('chatWaiter/search');
+            await store.dispatch('imWaiter/search');
             loading.value = false;
         } else {
-            store.commit('chatWaiter/setList', []);
-            store.commit('chatWaiter/setTotal', 0);
+            store.commit('imWaiter/setList', []);
+            store.commit('imWaiter/setTotal', 0);
         }
     };
     watch(
@@ -117,7 +116,7 @@
     watch(
         () => state.condition,
         (value) => {
-            store.commit('chatWaiter/setCondition', _.cloneDeep(value));
+            store.commit('imWaiter/setCondition', _.cloneDeep(value));
         },
         { immediate: true, deep: true }
     );
@@ -181,7 +180,7 @@
         try {
             await proxy.$validate(refsForm);
             let data = _.cloneDeep(formState.form);
-            await store.dispatch('chatWaiter/save', data);
+            await store.dispatch('imWaiter/save', data);
             formState.formVisible = false;
         } catch (e) {
             console.info('取消保存', e);
@@ -189,7 +188,7 @@
         formState.submitting = false;
     };
     const handleRemove = async (rows) => {
-        store.dispatch('chatWaiter/remove', {
+        store.dispatch('imWaiter/remove', {
             storeId: state.condition.storeId,
             waiterIds: rows.map((item) => item.waiterId),
         });
@@ -223,23 +222,6 @@
                 label: '客服昵称',
                 prop: 'waiterNickname',
             },
-            {
-                label: '操作',
-                fixed: 'right',
-                slots: {
-                    default: ({ row }) => (
-                        <div>
-                            <ElButton type="text" onClick={() => handleCreate(row)}>
-                                编辑
-                            </ElButton>
-                            <ElButton type="text" onClick={() => handleRemove([row])}>
-                                删除
-                            </ElButton>
-                        </div>
-                    ),
-                },
-                width: 120,
-            },
         ],
     });
 </script>

From 4789117bf127e77094d842febf2e6a3a28001f9d 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, 13 Jun 2022 10:39:33 +0800
Subject: [PATCH 14/14] =?UTF-8?q?refactor:=20IM=E5=AE=A2=E6=9C=8D=E9=87=8D?=
 =?UTF-8?q?=E6=9E=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/chat/waiter.js               | 36 +++++++++++
 src/store/modules/chat/chatWaiter.js | 28 ++++----
 src/views/chat/waiter.vue            | 97 ++++++----------------------
 src/views/im/store/index.vue         |  2 +-
 src/views/im/system/index.vue        |  2 +-
 src/views/im/waiter/index.vue        |  4 --
 6 files changed, 72 insertions(+), 97 deletions(-)
 create mode 100644 src/api/chat/waiter.js

diff --git a/src/api/chat/waiter.js b/src/api/chat/waiter.js
new file mode 100644
index 0000000..03004fc
--- /dev/null
+++ b/src/api/chat/waiter.js
@@ -0,0 +1,36 @@
+import request from '@/utils/request.js';
+export const search = (params) => {
+    return request({
+        url: '/mall/im/admin/waiterUser',
+        method: 'get',
+        params,
+    });
+};
+export const detail = (userId) => {
+    return request({
+        url: '/mall/im/admin/waiterUser/getWaiterByUserId',
+        method: 'get',
+        params: { userId },
+    });
+};
+export const create = (data) => {
+    return request({
+        url: '/mall/im/admin/waiterUser',
+        method: 'post',
+        data,
+    });
+};
+export const update = (data) => {
+    return request({
+        url: '/mall/im/admin/waiterUser',
+        method: 'put',
+        data,
+    });
+};
+export const remove = (ids) => {
+    return request({
+        url: '/mall/im/admin/waiterUser',
+        method: 'delete',
+        data: { ids },
+    });
+};
diff --git a/src/store/modules/chat/chatWaiter.js b/src/store/modules/chat/chatWaiter.js
index 3d4c0d7..7451300 100644
--- a/src/store/modules/chat/chatWaiter.js
+++ b/src/store/modules/chat/chatWaiter.js
@@ -1,4 +1,5 @@
-import * as api from '@/api/im/index.js';
+import * as api from '@/api/chat/waiter.js';
+import * as EmployeeAPI from '@/api/permission/employee.js';
 import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
 const state = () => ({
     code: 'ChatWaiter',
@@ -7,7 +8,7 @@ const state = () => ({
     total: 0,
     opts: {
         init: false,
-        store: [],
+        employee: [],
     },
 });
 const getters = {};
@@ -21,27 +22,26 @@ const mutations = {
 const actions = {
     search: async ({ state, commit, rootGetters }) => {
         let data = { ...state.condition };
-        let res = await api.searchWaiter({ ...rootGetters['local/page'](state.code), ...data });
-        if (res) {
-            commit('setList', res.records);
-            commit('setTotal', res.total);
-        } else {
+        let res = await api.search({ ...rootGetters['local/page'](state.code), ...data });
+        commit('setList', res?.records || []);
+        commit('setTotal', res?.total || 0);
+        if (!res) {
             ElMessage.error('查询失败');
-            commit('setList', []);
         }
         return res;
     },
-    load: async ({ commit }) => {
+    load: async ({ state, commit }) => {
         commit('setOpts', {
+            ...state.opts,
             init: true,
-            store: (await api.searchStore({ pageIndex: 1, length: 9999 }))?.records || [],
+            employee: (await EmployeeAPI.search({ pageIndex: 1, length: 9999 }))?.records || [],
         });
     },
     save: async ({ state, dispatch }, data) => {
         if (data.id) {
             data.systemId = state.condition.systemid;
         }
-        let save = data.id ? api.updateWaiter : api.createWaiter;
+        let save = data.id ? api.update : api.create;
         let res = await save(data);
         if (res) {
             ElMessage.success('保存成功');
@@ -51,13 +51,13 @@ const actions = {
         }
         return res;
     },
-    remove: async ({ dispatch }, data) => {
-        if (!data.waiterIds.length) {
+    remove: async ({ dispatch }, ids) => {
+        if (!ids.length) {
             ElMessage.warning('请选择要删除的数据');
         } else {
             try {
                 await ElMessageBox.confirm('数据删除后无法恢复，确定要删除吗?', '危险操作');
-                let res = await api.removeWaiter(data);
+                let res = await api.remove(ids);
                 if (res) {
                     ElMessage.success('删除成功');
                     dispatch('search');
diff --git a/src/views/chat/waiter.vue b/src/views/chat/waiter.vue
index 08614ff..4d15ea3 100644
--- a/src/views/chat/waiter.vue
+++ b/src/views/chat/waiter.vue
@@ -15,16 +15,6 @@
         >
             <template #search>
                 <el-form inline>
-                    <el-form-item label="所属店铺" prop="storeId">
-                        <el-select
-                            v-model="state.condition.storeId"
-                            :config="{ label: 'name', value: 'id' }"
-                            :opts="opts.store"
-                        />
-                    </el-form-item>
-                    <el-form-item label="客服ID" prop="waiterId">
-                        <el-input v-model="state.condition.waiterId" />
-                    </el-form-item>
                     <el-form-item label="客服昵称" prop="waiterNickname">
                         <el-input v-model="state.condition.waiterNickname" />
                     </el-form-item>
@@ -39,23 +29,17 @@
                 :model="formState.form"
                 :rules="formState.rules"
             >
-                <el-form-item label="所属店铺" prop="storeId">
+                <el-form-item label="客服员工" prop="userId">
                     <el-select
-                        v-model="formState.form.storeId"
-                        :config="{ label: 'name', value: 'id' }"
-                        :disabled="formState.form.id"
-                        :opts="opts.store"
+                        v-model="formState.form.userId"
+                        :config="{ label: 'employeeName', value: 'id' }"
+                        :disabled="!!formState.form.id"
+                        :opts="opts.employee"
                     />
                 </el-form-item>
-                <el-form-item label="客服类型" prop="type">
-                    <el-input v-model="formState.form.type" maxlength="20" />
-                </el-form-item>
                 <el-form-item label="客服头像" prop="waiterAvatar">
                     <el-upload-image v-model="formState.form.waiterAvatar" config-id="im/" />
                 </el-form-item>
-                <el-form-item label="客服ID" prop="waiterId">
-                    <el-input v-model="formState.form.waiterId" :disabled="!!formState.form.id" maxlength="20" />
-                </el-form-item>
                 <el-form-item label="客服昵称" prop="waiterNickname">
                     <el-input v-model="formState.form.waiterNickname" maxlength="20" />
                 </el-form-item>
@@ -72,7 +56,6 @@
     import ElButton from '@/components/extra/ElButton.vue';
     import ElImage from '@/components/extra/ElImage.vue';
     const store = useStore();
-    const route = useRoute();
     const { proxy } = getCurrentInstance();
     const loading = ref(false);
     const code = computed(() => store.state.chatWaiter.code);
@@ -84,36 +67,19 @@
     }
     const state = reactive({
         condition: {
-            storeId: null,
-            waiterId: null,
             waiterNickname: null,
         },
     });
     const handleReset = () => {
         state.condition = {
-            storeId: unref(opts).store?.[0]?.id,
-            waiterId: null,
             waiterNickname: null,
         };
     };
     const handleSearch = async () => {
-        if (state.condition.storeId) {
-            loading.value = true;
-            await store.dispatch('chatWaiter/search');
-            loading.value = false;
-        } else {
-            store.commit('chatWaiter/setList', []);
-            store.commit('chatWaiter/setTotal', 0);
-        }
+        loading.value = true;
+        await store.dispatch('chatWaiter/search');
+        loading.value = false;
     };
-    watch(
-        () => unref(opts).store,
-        (value) => {
-            if (!state.condition.storeId) {
-                state.condition.storeId = value[0]?.id;
-            }
-        }
-    );
     watch(
         () => state.condition,
         (value) => {
@@ -121,20 +87,7 @@
         },
         { immediate: true, deep: true }
     );
-    watch(
-        () => state.condition.storeId,
-        () => {
-            handleSearch();
-        }
-    );
-    onActivated(() => {
-        let storeId = route.query.storeId;
-        if (storeId) {
-            state.condition.storeId = +storeId;
-        } else {
-            handleSearch();
-        }
-    });
+    onActivated(handleSearch);
 
     /* 表单 */
     const refsForm = ref(null);
@@ -143,17 +96,13 @@
         submitting: false,
         form: {
             id: null,
-            storeId: null,
-            type: null,
             waiterAvatar: null,
-            waiterId: null,
+            userId: null,
             waiterNickname: null,
         },
         rules: {
-            storeId: [{ required: true, message: '所属店铺不能为空' }],
-            type: [{ required: true, message: '客服类型不能为空' }],
             waiterAvatar: [{ required: true, message: '客服头像不能为空' }],
-            waiterId: [{ required: true, message: '客服ID不能为空' }],
+            userId: [{ required: true, message: '客服员工不能为空' }],
             waiterNickname: [{ required: true, message: '客服昵称不能为空' }],
         },
     });
@@ -163,10 +112,8 @@
             formState.form,
             row || {
                 id: null,
-                storeId: null,
-                type: null,
                 waiterAvatar: null,
-                waiterId: null,
+                userId: null,
                 waiterNickname: null,
             }
         );
@@ -189,10 +136,10 @@
         formState.submitting = false;
     };
     const handleRemove = async (rows) => {
-        store.dispatch('chatWaiter/remove', {
-            storeId: state.condition.storeId,
-            waiterIds: rows.map((item) => item.waiterId),
-        });
+        store.dispatch(
+            'chatWaiter/remove',
+            rows.map((row) => row.id)
+        );
     };
     const config = reactive({
         // 表格列配置
@@ -202,23 +149,19 @@
                 width: 60,
             },
             {
-                label: '所属店铺',
-                width: 160,
+                label: '客服员工',
                 slots: {
-                    default: ({ row }) => proxy.$dict(unref(opts).store, row.storeId, { label: 'name', value: 'id' }),
+                    default: ({ row }) =>
+                        proxy.$dict(unref(opts).employee, row.userId, { label: 'employeeName', value: 'id' }),
                 },
             },
             {
                 label: '客服头像',
                 width: 160,
                 slots: {
-                    default: ({ row }) => <ElImage src={row.waiterAvatar} alt={row.waiterNickname} />,
+                    default: ({ row }) => <ElImage src={row.waiterAvatar} alt={row.waiterNickname} width="64px" />,
                 },
             },
-            {
-                label: '客服ID',
-                prop: 'waiterId',
-            },
             {
                 label: '客服昵称',
                 prop: 'waiterNickname',
diff --git a/src/views/im/store/index.vue b/src/views/im/store/index.vue
index 29bc429..4dd7193 100644
--- a/src/views/im/store/index.vue
+++ b/src/views/im/store/index.vue
@@ -154,7 +154,7 @@
     };
     const handleWaiter = (row) => {
         router.push({
-            name: 'ChatWaiter',
+            name: 'ImWaiter',
             query: {
                 storeId: row.id,
             },
diff --git a/src/views/im/system/index.vue b/src/views/im/system/index.vue
index c605698..607f4c6 100644
--- a/src/views/im/system/index.vue
+++ b/src/views/im/system/index.vue
@@ -131,7 +131,7 @@
         );
     };
     const handleStore = (row) => {
-        router.push({ name: 'ChatStore', query: { sysId: row.id } });
+        router.push({ name: 'ImStore', query: { sysId: row.id } });
     };
     const config = reactive({
         // 表格列配置
diff --git a/src/views/im/waiter/index.vue b/src/views/im/waiter/index.vue
index 2cbc990..cc7ee15 100644
--- a/src/views/im/waiter/index.vue
+++ b/src/views/im/waiter/index.vue
@@ -196,10 +196,6 @@
     const config = reactive({
         // 表格列配置
         columns: [
-            {
-                type: 'selection',
-                width: 60,
-            },
             {
                 label: '所属店铺',
                 width: 160,