|
@@ -0,0 +1,191 @@
|
|
|
+<template>
|
|
|
+ <el-dialog v-model="state.dialogVisible" width="60%" draggable title="新增智能回访任务" @close="close" append-to-body destroy-on-close>
|
|
|
+ <el-form :model="state.ruleForm" label-width="90px" ref="ruleFormRef" v-loading="state.loading">
|
|
|
+ <el-row :gutter="10">
|
|
|
+ <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
|
|
+ <el-form-item label="任务名称" prop="name" :rules="[{ required: true, message: '请输入任务名称', trigger: 'blur' }]">
|
|
|
+ <el-input v-model="state.ruleForm.name" placeholder="请输入任务名称" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
|
|
+ <el-form-item label="时间段" prop="crTime" :rules="[{ required: true, message: '请选择时间段', trigger: 'change' }]">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="state.ruleForm.crTime"
|
|
|
+ type="datetimerange"
|
|
|
+ unlink-panels
|
|
|
+ range-separator="至"
|
|
|
+ start-placeholder="开始时间"
|
|
|
+ end-placeholder="结束时间"
|
|
|
+ :shortcuts="shortcuts"
|
|
|
+ value-format="YYYY-MM-DD[T]HH:mm:ss"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
|
|
|
+ <el-form-item label="节日禁呼" prop="festivalBan" :rules="[{ required: true, message: '请选择节日禁呼', trigger: 'change' }]">
|
|
|
+ <el-radio-group v-model="state.ruleForm.festivalBan">
|
|
|
+ <el-radio :label="1">是</el-radio>
|
|
|
+ <el-radio :label="0">否</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ <el-divider content-position="left" class="mb30">
|
|
|
+ <el-text tag="b" size="large"> 回访任务名单 </el-text>
|
|
|
+ </el-divider>
|
|
|
+ <el-table :data="state.tableData" v-loading="state.loading" row-key="id" @selection-change="handleSelectionChange" ref="multipleTableRef">
|
|
|
+ <el-table-column type="selection" label="" width="55" :reserve-selection="true" />
|
|
|
+ <el-table-column prop="order.no" label="工单编码" show-overflow-tooltip width="150"></el-table-column>
|
|
|
+ <el-table-column label="标题" show-overflow-tooltip width="300">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <order-detail :order="row.order" @updateList="queryList">{{ row.order?.title }}</order-detail>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="order.sourceChannel" label="来源方式" show-overflow-tooltip></el-table-column>
|
|
|
+ <el-table-column prop="visitStateText" label="回访状态" show-overflow-tooltip></el-table-column>
|
|
|
+ <!-- <el-table-column label="短信发送时间" show-overflow-tooltip width="170">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <span>{{ formatDate(row.order?.startTime, 'YYYY-mm-dd HH:MM:SS') }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>-->
|
|
|
+ <el-table-column prop="order.acceptType" label="受理类型" show-overflow-tooltip width="150"></el-table-column>
|
|
|
+ <el-table-column prop="order.hotspotName" label="热点分类" show-overflow-tooltip width="100"></el-table-column>
|
|
|
+ <el-table-column prop="order.actualHandleStepName" label="办理节点" show-overflow-tooltip width="150"></el-table-column>
|
|
|
+ <el-table-column prop="order.employeeName" label="受理人" show-overflow-tooltip width="120">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <span
|
|
|
+ >{{ row.order?.acceptorName }} <span v-if="row.order?.acceptorStaffNo">[{{ row.order?.acceptorStaffNo }}]</span>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="order.orgLevelOneName" label="一级部门" show-overflow-tooltip width="150"></el-table-column>
|
|
|
+ <el-table-column prop="order.actualHandleOrgName" label="接办部门" show-overflow-tooltip width="150"></el-table-column>
|
|
|
+ <el-table-column label="受理时间" show-overflow-tooltip width="170">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <span>{{ formatDate(row.order?.startTime, 'YYYY-mm-dd HH:MM:SS') }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="办结时间" show-overflow-tooltip width="170">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <span>{{ formatDate(row.order?.filedTime, 'YYYY-mm-dd HH:MM:SS') }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="办结时间" show-overflow-tooltip width="170">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <span>{{ formatDate(row.order?.filedTime, 'YYYY-mm-dd HH:MM:SS') }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="发布时间" show-overflow-tooltip width="170">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <span>{{ formatDate(row.publishTime, 'YYYY-mm-dd HH:MM:SS') }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="employeeName" label="回访人" show-overflow-tooltip width="170"></el-table-column>
|
|
|
+ <template #empty>
|
|
|
+ <Empty />
|
|
|
+ </template>
|
|
|
+ </el-table>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button @click="state.dialogVisible = false" class="default-button">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="onSubmit(ruleFormRef)" :loading="state.loading" :disabled="!multipleSelection.length">确 定</el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+</template>
|
|
|
+<script setup lang="ts">
|
|
|
+import { formatDate } from '@/utils/formatTime';
|
|
|
+import { ElMessage, FormInstance } from 'element-plus';
|
|
|
+import { reactive, ref,defineAsyncComponent } from 'vue';
|
|
|
+import { getSmartVisitRecord } from '@/api/smartVisit';
|
|
|
+import { shortcuts } from '@/utils/constants';
|
|
|
+import { smartVisitAdd } from '@/api/smartVisit';
|
|
|
+
|
|
|
+const OrderDetail = defineAsyncComponent(() => import('@/components/OrderDetail/index.vue')); // 工单详情
|
|
|
+const emit = defineEmits(['updateList']);
|
|
|
+const state = reactive<any>({
|
|
|
+ queryParams: {
|
|
|
+ Keyword: null, // 关键字
|
|
|
+ },
|
|
|
+ tableData: [], //表格
|
|
|
+ loading: false, // 加载
|
|
|
+ dialogVisible: false, // 弹窗
|
|
|
+ ruleForm: {
|
|
|
+ name: '',
|
|
|
+ crTime: [],
|
|
|
+ festivalBan: 1,
|
|
|
+ }, // 表单数据
|
|
|
+});
|
|
|
+// 打开弹窗
|
|
|
+const openDialog = () => {
|
|
|
+ queryList();
|
|
|
+};
|
|
|
+const close = () => {
|
|
|
+ multipleSelection.value = [];
|
|
|
+ ruleFormRef.value?.clearValidate();
|
|
|
+ ruleFormRef.value?.resetFields();
|
|
|
+};
|
|
|
+// 获取所有工单列表
|
|
|
+const queryList = async () => {
|
|
|
+ state.dialogVisible = true;
|
|
|
+ try {
|
|
|
+ state.loading = true;
|
|
|
+ const res = await getSmartVisitRecord(state.queryParams);
|
|
|
+ state.tableData = res.result;
|
|
|
+ state.loading = false;
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e);
|
|
|
+ state.loading = false;
|
|
|
+ }
|
|
|
+};
|
|
|
+// 重置所有工单列表
|
|
|
+const queryParamsRef = ref<RefType>();
|
|
|
+const resetQuery = (formEl: FormInstance | undefined) => {
|
|
|
+ if (!formEl) return;
|
|
|
+ formEl.resetFields();
|
|
|
+ queryList();
|
|
|
+};
|
|
|
+const multipleSelection = ref<EmptyArrayType>([]); // 重复件表格选中项
|
|
|
+const multipleTableRef = ref<RefType>(); // 重复件表格ref
|
|
|
+const handleSelectionChange = (row: any) => {
|
|
|
+ multipleSelection.value = row;
|
|
|
+};
|
|
|
+
|
|
|
+// 确定选择所有工单到重复工单
|
|
|
+const ruleFormRef = ref<RefType>();
|
|
|
+const onSubmit = async (formEl: FormInstance | undefined) => {
|
|
|
+ if (!formEl) return;
|
|
|
+ await formEl.validate((valid: boolean) => {
|
|
|
+ if (!valid) return;
|
|
|
+ state.loading = true;
|
|
|
+ const request = {
|
|
|
+ name: state.ruleForm.name,
|
|
|
+ beginTime: state.ruleForm.crTime[0],
|
|
|
+ endTime: state.ruleForm.crTime[1],
|
|
|
+ festivalBan: state.ruleForm.festivalBan,
|
|
|
+ aiOrderVisitDetails: multipleSelection.value.map((item: any) => {
|
|
|
+ return {
|
|
|
+ orderId: item.order?.id,
|
|
|
+ orderVisitId: item.id,
|
|
|
+ outerNo: item.order?.contact,
|
|
|
+ };
|
|
|
+ }),
|
|
|
+ };
|
|
|
+ smartVisitAdd(request)
|
|
|
+ .then(() => {
|
|
|
+ state.loading = false;
|
|
|
+ state.dialogVisible = false;
|
|
|
+ ElMessage.success('操作成功');
|
|
|
+ emit('updateList');
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ state.loading = false;
|
|
|
+ });
|
|
|
+ });
|
|
|
+};
|
|
|
+defineExpose({
|
|
|
+ openDialog,
|
|
|
+});
|
|
|
+</script>
|
|
|
+<style scoped lang="scss"></style>
|