parent
99b44440c3
commit
2d80b2f2ac
@ -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,
|
||||
});
|
||||
};
|
@ -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,
|
||||
};
|
@ -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,
|
||||
};
|
@ -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,
|
||||
};
|
@ -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,
|
||||
};
|
@ -0,0 +1,7 @@
|
||||
<template>
|
||||
<div>在线人数</div>
|
||||
</template>
|
||||
|
||||
<script setup></script>
|
||||
|
||||
<style lang="less" scoped></style>
|
@ -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>
|
@ -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>
|
@ -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>
|
Loading…
Reference in new issue