|
|
|
@ -9,62 +9,67 @@ |
|
|
|
修改时间： |
|
|
|
--> |
|
|
|
<template> |
|
|
|
<DynamicTable |
|
|
|
size="small" |
|
|
|
showIndex |
|
|
|
headerTitle="问题工单列表" |
|
|
|
titleTooltip="" |
|
|
|
:data-request="loadData" |
|
|
|
:columns="columns" |
|
|
|
row-key="id" |
|
|
|
@resize-column="handleResizeColumn" |
|
|
|
:row-selection="rowSelection" |
|
|
|
:scroll="{ x: '100vw' }" |
|
|
|
> |
|
|
|
<template v-if="isCheckRows" #title> |
|
|
|
<Alert class="w-full" type="info" show-icon> |
|
|
|
<template #message> |
|
|
|
已选 {{ isCheckRows }} 项 |
|
|
|
<a-button type="link" @click="rowSelection.selectedRowKeys = []">取消选择</a-button> |
|
|
|
</template> |
|
|
|
</Alert> |
|
|
|
</template> |
|
|
|
<template #toolbar> |
|
|
|
<a-button type="primary" @click="handleAdd">新增</a-button> |
|
|
|
<a-button |
|
|
|
type="danger" |
|
|
|
:disabled="!isCheckRows" |
|
|
|
@click="delRowConfirm(rowSelection.selectedRowKeys)" |
|
|
|
> |
|
|
|
<DeleteOutlined /> 删除 |
|
|
|
</a-button> |
|
|
|
</template> |
|
|
|
</DynamicTable> |
|
|
|
<DraggableModal |
|
|
|
v-model:visible="visible" |
|
|
|
:width="700" |
|
|
|
:bodyStyle="{ |
|
|
|
height: '70vh', |
|
|
|
}" |
|
|
|
:force-render="true" |
|
|
|
:title="`${curRecord.id ? '编辑' : '新增'}问题工单`" |
|
|
|
@ok="handleOk" |
|
|
|
@cancel="handleCancel" |
|
|
|
> |
|
|
|
<SchemaForm> |
|
|
|
<template #solution="{ formModel, field }"> |
|
|
|
<div class="ql-box"> |
|
|
|
<QuillEditor |
|
|
|
ref="quillEditor" |
|
|
|
theme="snow" |
|
|
|
v-model:content="formModel[field]" |
|
|
|
:options="editorOptions" |
|
|
|
contentType="html" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div class="issue-container" ref="issueContainerRef"> |
|
|
|
<DynamicTable |
|
|
|
size="small" |
|
|
|
showIndex |
|
|
|
headerTitle="问题工单列表" |
|
|
|
titleTooltip="" |
|
|
|
:data-request="loadData" |
|
|
|
:columns="columns" |
|
|
|
row-key="id" |
|
|
|
@resize-column="handleResizeColumn" |
|
|
|
:row-selection="rowSelection" |
|
|
|
:scroll="{ x: '100vw' }" |
|
|
|
> |
|
|
|
<template v-if="isCheckRows" #title> |
|
|
|
<Alert class="w-full" type="info" show-icon> |
|
|
|
<template #message> |
|
|
|
已选 {{ isCheckRows }} 项 |
|
|
|
<a-button type="link" @click="rowSelection.selectedRowKeys = []">取消选择</a-button> |
|
|
|
</template> |
|
|
|
</Alert> |
|
|
|
</template> |
|
|
|
<template #toolbar> |
|
|
|
<a-button type="primary" @click="handleAdd">新增</a-button> |
|
|
|
<a-button |
|
|
|
type="danger" |
|
|
|
:disabled="!isCheckRows" |
|
|
|
@click="delRowConfirm(rowSelection.selectedRowKeys)" |
|
|
|
> |
|
|
|
<DeleteOutlined /> 删除 |
|
|
|
</a-button> |
|
|
|
</template> |
|
|
|
</SchemaForm> |
|
|
|
</DraggableModal> |
|
|
|
</DynamicTable> |
|
|
|
<Modal |
|
|
|
v-model:visible="visible" |
|
|
|
:width="700" |
|
|
|
:bodyStyle="{ |
|
|
|
height: '70vh', |
|
|
|
overflow: 'auto', |
|
|
|
}" |
|
|
|
:title="`${curRecord.id ? '编辑' : '新增'}问题工单`" |
|
|
|
@ok="handleOk" |
|
|
|
@cancel="handleCancel" |
|
|
|
:mask-closable="false" |
|
|
|
:destroyOnClose="true" |
|
|
|
:getContainer="() => issueContainerRef" |
|
|
|
> |
|
|
|
<SchemaForm> |
|
|
|
<template #solution="{ formModel, field }"> |
|
|
|
<div class="ql-box"> |
|
|
|
<QuillEditor |
|
|
|
ref="quillEditor" |
|
|
|
theme="snow" |
|
|
|
v-model:content="formModel[field]" |
|
|
|
:options="editorOptions" |
|
|
|
contentType="html" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</SchemaForm> |
|
|
|
</Modal> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script lang="tsx" setup> |
|
|
|
@ -83,7 +88,7 @@ |
|
|
|
addToknowledge, |
|
|
|
} from '@/api/issue'; |
|
|
|
import { computed, nextTick, ref, watch, onMounted } from 'vue'; |
|
|
|
import { Modal, message, Alert } from 'ant-design-vue'; |
|
|
|
import { message, Alert } from 'ant-design-vue'; |
|
|
|
import { useRouter } from 'vue-router'; |
|
|
|
import { useFormModal } from '@/hooks/useModal/index'; |
|
|
|
import { getEditFormSchema, getFlowFormSchema } from './formSchemas'; |
|
|
|
@ -100,6 +105,7 @@ |
|
|
|
|
|
|
|
const router = useRouter(); |
|
|
|
|
|
|
|
const issueContainerRef = ref<HTMLElement | null>(null); |
|
|
|
const curRecord = ref<Partial<TableListItem>>({}); |
|
|
|
const visible = ref(false); |
|
|
|
const quillEditor = ref<InstanceType<typeof QuillEditor> | null>(null); |
|
|
|
@ -132,20 +138,35 @@ |
|
|
|
}, |
|
|
|
}); |
|
|
|
|
|
|
|
// watch( |
|
|
|
// () => curRecord.value, |
|
|
|
// (newVal) => { |
|
|
|
// formRef?.setFieldsValue(newVal); |
|
|
|
// }, |
|
|
|
// { |
|
|
|
// immediate: true, |
|
|
|
// deep: true, |
|
|
|
// }, |
|
|
|
// ); |
|
|
|
const time = ref(0); |
|
|
|
|
|
|
|
watch( |
|
|
|
() => curRecord.value, |
|
|
|
() => visible.value, |
|
|
|
(newVal) => { |
|
|
|
formRef?.setFieldsValue(newVal); |
|
|
|
}, |
|
|
|
{ |
|
|
|
immediate: true, |
|
|
|
deep: true, |
|
|
|
if (newVal) { |
|
|
|
nextTick(() => { |
|
|
|
if (time.value === 0) { |
|
|
|
quillImageUploadCustom(quillEditor.value); |
|
|
|
time.value++; |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
); |
|
|
|
|
|
|
|
// 替换 Quill 编辑器的图片按钮操作 |
|
|
|
onMounted(() => { |
|
|
|
quillImageUploadCustom(quillEditor.value); |
|
|
|
// quillImageUploadCustom(quillEditor.value); |
|
|
|
}); |
|
|
|
|
|
|
|
const handleOk = async () => { |
|
|
|
@ -388,8 +409,11 @@ |
|
|
|
formRef?.resetFields(); |
|
|
|
}; |
|
|
|
|
|
|
|
const openModal = () => { |
|
|
|
const openModal = (cb: any) => { |
|
|
|
visible.value = true; |
|
|
|
nextTick(() => { |
|
|
|
cb(); |
|
|
|
}); |
|
|
|
formRef.clearValidate(); |
|
|
|
}; |
|
|
|
|
|
|
|
@ -408,9 +432,10 @@ |
|
|
|
const handleAdd = () => { |
|
|
|
curRecord.value = {}; |
|
|
|
// formRef?.setFieldsValue(curRecord.value); |
|
|
|
formRef?.setFieldsValue(curRecord.value); |
|
|
|
quillEditor.value?.setContents(''); |
|
|
|
resetFormFields(); |
|
|
|
openModal(); |
|
|
|
openModal(() => {}); |
|
|
|
}; |
|
|
|
|
|
|
|
const handleEdit = async (record: TableListItem) => { |
|
|
|
@ -434,7 +459,7 @@ |
|
|
|
} |
|
|
|
curRecord.value = res; |
|
|
|
|
|
|
|
quillEditor.value?.setContents(res?.solution); |
|
|
|
// quillEditor.value?.setContents(res?.solution); |
|
|
|
// formRef?.setFieldsValue(res); |
|
|
|
|
|
|
|
if (res?.productId) { |
|
|
|
@ -459,7 +484,10 @@ |
|
|
|
} |
|
|
|
|
|
|
|
nextTick(() => { |
|
|
|
openModal(); |
|
|
|
openModal(() => { |
|
|
|
formRef?.setFieldsValue(res); |
|
|
|
quillEditor.value?.setContents(res?.solution); |
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
}; |
|
|
|
|
AaronWu
2 months ago