wuyin
/
IssueSupportManage
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

feat: 工单状态修改，提交函数添加防抖

master
AaronWu 3 months ago
parent
fb01325d8a
commit
1168b0f2e3
8 changed files with 299 additions and 208 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      src/views/client/issue/columns.tsx
  2. 38
      src/views/client/issue/data.ts
  3. 14
      src/views/client/issue/index.vue
  4. 4
      src/views/question/issue/columns.tsx
  5. 25
      src/views/question/issue/data.ts
  6. 111
      src/views/question/issue/index.vue
  7. 43
      src/views/question/knowledge/index.vue
  8. 2
      vite.config.ts

4
src/views/client/issue/columns.tsx
View File

@ -157,7 +157,9 @@ export const baseColumns: TableColumnItem[] = [
},
},
customRender: ({ record }) => {
const { label, color } = stateTypeList.find((e) => e.value === record.state);
const obj = stateTypeList.find((e) => e.value === record.state);
const label = obj?.label;
const color = obj?.color;
return <Tag color={color}>{label}</Tag>;
},

38
src/views/client/issue/data.ts
View File

@ -1,32 +1,46 @@
/*
* @Author: AaronWu 2463371514@qq.com
* @Date: 2025-04-16 14:22:07
* @LastEditors: AaronWu 2463371514@qq.com
* @LastEditTime: 2026-01-14 10:57:35
* @FilePath: /IssueSupportManage/src/views/client/issue/data.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
export const stateTypeList: any = [
// Init(0,"待处理"),
// Back(1,"退回"),
// Develop(2,"开发中"),
// Test(3,"测试中"),
// End(4,"结束"),
{
label: '退回',
value: -1,
color: '#2db7f5',
},
{
label: '待处理',
value: 0,
color: '#f50',
},
{
label: '退回',
label: '开发中',
value: 1,
color: '#2db7f5',
color: '#87d068',
},
{
label: '开发中',
label: '测试中',
value: 2,
color: '#87d068',
color: '#108ee9',
},
// 待客户确认
{
label: '测试中',
label: '待客户确认',
value: 3,
color: '#108ee9',
color: '#2db7f5',
},
{
label: '已解决',
value: 4,
color: '#f50',
color: '#87d068',
},
{
label: '关闭',
value: 5,
color: '#d9d9d9',
},
];

14
src/views/client/issue/index.vue
View File

@ -275,7 +275,10 @@
...e,
};
});
values.fileIds = values.files.filter((e) => e.id).map((e) => e.id).join(',');
values.fileIds = values.files
.filter((e) => e.id)
.map((e) => e.id)
.join(',');
}
if (values?.fileIds === ',') {
values.fileIds = '';
@ -529,8 +532,9 @@
if (records && Array.isArray(records) && records.length) {
childItem.children = (records as any).map((e) => {
const { label, color } = stateTypeList.find((d) => d.value === e.state);
const obj = stateTypeList.find((i) => i.value === e.state);
const label = obj?.label;
const color = obj?.color;
return {
title: e.title,
key: e.id,
@ -567,7 +571,9 @@
if (records && Array.isArray(records) && records.length) {
tree = (records as any).map((e) => {
const { label, color } = stateTypeList.find((d) => d.value === e.state);
const obj = stateTypeList.find((i) => i.value === e.state);
const label = obj?.label;
const color = obj?.color;
return {
title: e.title,

4
src/views/question/issue/columns.tsx
View File

@ -242,7 +242,9 @@ export const baseColumns: TableColumnItem[] = [
},
},
customRender: ({ record }) => {
const { label, color } = stateTypeList.find((e) => e.value === record.state);
const obj = stateTypeList.find((e) => e.value === record.state);
const label = obj?.label;
const color = obj?.color;
return <Tag color={color}>{label}</Tag>;
},

25
src/views/question/issue/data.ts
View File

@ -1,43 +1,38 @@
export const stateTypeList: any = [
// Init(0,"待处理"),
// Back(1,"退回"),
// Develop(2,"开发中"),
// Test(3,"测试中"),
// End(4,"结束"),
{
label: '退回',
value: -1,
color: '#2db7f5',
},
{
label: '待处理',
value: 0,
color: '#f50',
},
{
label: '退回',
value: 1,
color: '#2db7f5',
},
{
label: '开发中',
value: 2,
value: 1,
color: '#87d068',
},
{
label: '测试中',
value: 3,
value: 2,
color: '#108ee9',
},
// 待客户确认
{
label: '待客户确认',
value: 4,
value: 3,
color: '#2db7f5',
},
{
label: '已解决',
value: 5,
value: 4,
color: '#87d068',
},
{
label: '关闭',
value: 6,
value: 5,
color: '#d9d9d9',
},
];

111
src/views/question/issue/index.vue
View File

@ -126,6 +126,7 @@
const curRowId = ref<any>('');
const visible = ref(false);
const quillEditor = ref<InstanceType<typeof QuillEditor> | null>(null);
const submitting = ref(false); // 表单提交状态
const editorOptions = ref({
theme: 'snow',
modules: {
@ -205,7 +206,11 @@
// quillImageUploadCustom(quillEditor.value);
});
const handleOk = async () => {
const handleOk = useDebounceFn(async () => {
if (submitting.value) {
return;
}
const values = await formRef?.validate();
if (values) {
console.log('values: ', values);
@ -214,6 +219,9 @@
message.warning('请等待附件上传完成');
return;
}
submitting.value = true;
try {
values.id = curRecord.value.id;
if (values.files && Array.isArray(values.files) && values.files.length) {
@ -249,8 +257,13 @@
visible.value = false;
resetFormFields();
dynamicTableInstance?.reload();
} catch (error) {
console.error('提交失败:', error);
} finally {
submitting.value = false;
}
};
}
}, 300);
const handleCancel = () => {
visible.value = false;
@ -311,17 +324,17 @@
handleEdit(record);
},
},
{
icon: 'init',
size: '15',
title: '处理',
label: '处理',
ifShow: stateText === '退回',
onClick: (e) => {
e.stopPropagation();
changeState(record, 0);
},
},
// {
// icon: 'init',
// size: '15',
// title: '处理',
// label: '处理',
// ifShow: stateText === '退回',
// onClick: (e) => {
// e.stopPropagation();
// changeState(record, 0);
// },
// },
{
icon: 'dev',
size: '15',
@ -330,7 +343,7 @@
ifShow: stateText === '待处理',
onClick: (e) => {
e.stopPropagation();
changeState(record, 2);
changeState(record, 1);
},
},
{
@ -338,10 +351,10 @@
size: '20',
title: '退回',
label: '退回',
ifShow: stateText === '开发中' || stateText === '测试中',
ifShow: stateText !== '待处理' && stateText !== '关闭',
onClick: (e) => {
e.stopPropagation();
changeState(record, 1);
changeState(record, record.state - 1);
},
},
{
@ -352,7 +365,7 @@
ifShow: stateText === '开发中',
onClick: (e) => {
e.stopPropagation();
changeState(record, 3);
changeState(record, 2);
},
},
// 待客户确认 4
@ -364,7 +377,7 @@
ifShow: stateText === '测试中',
onClick: (e) => {
e.stopPropagation();
changeState(record, 4);
changeState(record, 3);
},
},
{
@ -375,7 +388,7 @@
ifShow: stateText === '待客户确认',
onClick: (e) => {
e.stopPropagation();
changeState(record, 5);
changeState(record, 4);
},
},
{
@ -397,7 +410,7 @@
ifShow: stateText !== '关闭',
onClick: (e) => {
e.stopPropagation();
changeState(record, 6);
changeState(record, 5);
},
},
{
@ -425,12 +438,15 @@
/**
* @description 打开问题工单弹窗
*/
const openIssueModal = async (record: Partial<TableListItem> = {}, isReadOnly = false) => {
const [formRef] = await showModal<any>({
modalProps: {
title: `${isReadOnly ? '查看' : record.id ? '编辑' : '新增'}问题工单`,
width: 700,
onFinish: async (values) => {
// 创建防抖的提交处理函数
const createSubmitHandler = (record: Partial<TableListItem>, isModal = false) => {
let isSubmitting = false;
return useDebounceFn(async (values: any) => {
if (isSubmitting) {
return;
}
isSubmitting = true;
try {
console.log('新增/编辑问题工单', values);
values.id = record.id;
@ -462,7 +478,22 @@
await (record.id ? updateIssue : createIssue)(values);
message.success(`${record.id ? '编辑' : '新增'}成功`);
dynamicTableInstance?.reload();
},
} catch (error) {
console.error('提交失败:', error);
} finally {
isSubmitting = false;
}
}, 300);
};
const openIssueModal = async (record: Partial<TableListItem> = {}, isReadOnly = false) => {
const handleSubmit = createSubmitHandler(record);
const [formRef] = await showModal<any>({
modalProps: {
title: `${isReadOnly ? '查看' : record.id ? '编辑' : '新增'}问题工单`,
width: 700,
onFinish: handleSubmit,
footer: isReadOnly ? null : undefined,
},
formProps: {
@ -499,11 +530,14 @@
const openFlowModal = async (record: Partial<TableListItem> = {}, state) => {
const flowTitle = stateTypeList.find((item) => item.value === state)?.label;
const [formRef] = await showFlowModal<any>({
modalProps: {
title: `${flowTitle}问题工单`,
width: 700,
onFinish: async (values) => {
let isFlowSubmitting = false;
const handleFlowSubmit = useDebounceFn(async (values: any) => {
if (isFlowSubmitting) {
return;
}
isFlowSubmitting = true;
try {
await updateIssueState({
id: record.id,
state: state,
@ -518,7 +552,18 @@
curRowId.value = record.id;
});
}
},
} catch (error) {
console.error('提交失败:', error);
} finally {
isFlowSubmitting = false;
}
}, 300);
const [formRef] = await showFlowModal<any>({
modalProps: {
title: `${flowTitle}问题工单`,
width: 700,
onFinish: handleFlowSubmit,
},
formProps: {
labelWidth: 100,

43
src/views/question/knowledge/index.vue
View File

@ -98,6 +98,7 @@
import { createDictValue } from '@/api/dict';
import { DictEnum } from '@/enums/dictEnum';
import { getDictionaryByTypeName } from '@/utils/dict';
import { useDebounceFn } from '@vueuse/core';
defineOptions({
name: 'knowledge',
});
@ -106,6 +107,7 @@
const curRecord = ref<Partial<TableListItem>>({});
const visible = ref(false);
const submitting = ref(false); // 表单提交状态
const quillEditor = ref<InstanceType<typeof QuillEditor> | null>(null);
@ -170,7 +172,11 @@
// quillImageUploadCustom(quillEditor.value);
});
const handleOk = async () => {
const handleOk = useDebounceFn(async () => {
if (submitting.value) {
return;
}
const values = await formRef?.validate();
if (values) {
console.log('values: ', values);
@ -179,6 +185,9 @@
message.warning('请等待附件上传完成');
return;
}
submitting.value = true;
try {
values.id = curRecord.value.id;
if (values.files && Array.isArray(values.files) && values.files.length) {
@ -228,8 +237,13 @@
visible.value = false;
resetFormFields();
dynamicTableInstance?.reload();
} catch (error) {
console.error('提交失败:', error);
} finally {
submitting.value = false;
}
};
}
}, 300);
const handleCancel = () => {
visible.value = false;
@ -283,11 +297,13 @@
record: Partial<TableListItem> = {},
isReadOnly = false,
) => {
const [formRef] = await showModal<any>({
modalProps: {
title: `${isReadOnly ? '查看' : record.id ? '编辑' : '新增'}知识库`,
width: 700,
onFinish: async (values) => {
let isModalSubmitting = false;
const handleModalSubmit = useDebounceFn(async (values: any) => {
if (isModalSubmitting) {
return;
}
isModalSubmitting = true;
try {
console.log('新增/编辑知识库', values);
values.id = record.id;
@ -315,7 +331,18 @@
await (record.id ? updateKnowledgeBase : createKnowledgeBase)(values);
message.success(`${record.id ? '编辑' : '新增'}成功`);
dynamicTableInstance?.reload();
},
} catch (error) {
console.error('提交失败:', error);
} finally {
isModalSubmitting = false;
}
}, 300);
const [formRef] = await showModal<any>({
modalProps: {
title: `${isReadOnly ? '查看' : record.id ? '编辑' : '新增'}知识库`,
width: 700,
onFinish: handleModalSubmit,
footer: isReadOnly ? null : undefined,
},
formProps: {

2
vite.config.ts
View File

@ -126,7 +126,7 @@ export default defineConfig({
// },
'/server': {
target: 'http://43.137.2.78:8085',
// target: 'http://192.168.2.22:8089',
// target: 'http://192.168.2.27:8089',
changeOrigin: true,
rewrite: (path) => path.replace(/^\/server/, '/server'),
},

Write Preview
Loading…
Cancel
Save