feat:新增工单撤销，工单延期，工单督办弹窗，工单页面新增tab分类展示全部工单，即将超级等工单类型;

src/components/TimeLine/index.vue → src/components/ProcessTimeLine/index.vue

@@ -92,7 +92,7 @@
 				<el-collapse-transition>
 					<div v-if="item.traces && item.traces.length" class="item-children mt20" v-show="isOpen(item.code)">
 						<!-- 嵌套组件 -->
-						<TimeLine
+						<process-time-line
 							:data="item.traces"
 							class="sub-time-line"
 							:expandedKeys="props.expandedKeys"
@@ -107,7 +107,7 @@
 	</div>
 </template>
 
-<script setup lang="ts" name="TimeLine">
+<script setup lang="ts" name="processTimeLine">
 import { defineAsyncComponent, computed, reactive, watch, onMounted } from 'vue';
 import { getImageUrl } from '/@/utils/tools';
 import { formatDate } from '/@/utils/formatTime';
@@ -326,4 +326,7 @@ onMounted(() => {
 :deep(.el-timeline-item__tail) {
 	border-left: 1px solid #bfcdff;
 }
+:deep(.el-timeline-item:last-child .el-timeline-item__tail){
+  display: block;
+}
 </style>

src/views/business/followUp/component/Follow-up-phone.vue

@@ -162,7 +162,7 @@
     </template>
   </el-dialog>
 </template>
-<script setup lang="ts" name="orderReleaseDetail">
+<script setup lang="ts" name="orderFollowUpPhone">
 import { reactive, ref } from 'vue';
 import {ElMessageBox, ElNotification} from 'element-plus';
 import {telToOuter} from "/@/api/login/user";

src/views/business/order/accept/orderAdd.vue

@@ -553,13 +553,13 @@
 			</el-col>
 		</el-row>
 		<!-- 拓展表单 -->
-		<ExpandForm ref="ExpandFormRef" @saveExpandForm="saveExpandForm" />
+		<order-expand-form ref="ExpandFormRef" @saveExpandForm="saveExpandForm" />
 		<!-- 历史工单 -->
-		<History ref="HistoryOrderRef" @saveSelect="saveSelect" />
+		<order-history ref="HistoryOrderRef" @saveSelect="saveSelect" />
 		<!-- 提交流程 -->
-		<Process ref="processRef" @submitProcessSuccess="submitProcessSuccess" />
+		<order-process ref="processRef" @orderProcessSuccess="orderProcessSuccess" />
 		<!-- 补充信息 -->
-		<Supply ref="SupplyRef" @onSupplySubmit="onSupplySubmit" />
+		<order-supply ref="SupplyRef" @onSupplySuccess="onSupplySuccess" />
 	</div>
 </template>
 
@@ -580,11 +580,11 @@ import { knowPopScreen, getKeyWord } from '/@/api/knowledge';
 import mittBus from '/@/utils/mitt';
 
 // 引入组件
-const Process = defineAsyncComponent(() => import('/@/views/business/order/components/Order-process.vue'));
-const ExpandForm = defineAsyncComponent(() => import('/@/views/business/order/components/Order-expand-form.vue'));
-const History = defineAsyncComponent(() => import('/@/views/business/order/components/order-history.vue'));
+const OrderProcess = defineAsyncComponent(() => import('/@/views/business/order/components/Order-process.vue'));
+const OrderExpandForm = defineAsyncComponent(() => import('/@/views/business/order/components/Order-expand-form.vue'));
+const OrderHistory = defineAsyncComponent(() => import('/src/views/business/order/components/Order-history.vue'));
 const Comment = defineAsyncComponent(() => import('/@/views/business/order/components/Order-comment.vue'));
-const Supply = defineAsyncComponent(() => import('/@/views/business/order/components/Order-supply.vue'));
+const OrderSupply = defineAsyncComponent(() => import('/@/views/business/order/components/Order-supply.vue'));
 const Upload = defineAsyncComponent(() => import('/@/components/Upload/index.vue'));
 // 定义变量内容
 const state = reactive<any>({
@@ -924,7 +924,7 @@ const chooseComment = (item: any) => {
 	state.ruleForm.content += item.content;
 };
 // 流程提交成功
-const submitProcessSuccess = () => {
+const orderProcessSuccess = () => {
 	// 关闭当前 tagsView
 	mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
 	mittBus.emit('clearCache', 'order');
@@ -972,7 +972,7 @@ const onSupply = (val: any) => {
 	SupplyRef.value.openDialog(val);
 };
 // 补充意见提交成功
-const onSupplySubmit = () => {
+const onSupplySuccess = () => {
 	searchHistory();
 };
 // 预览知识

src/views/business/order/accept/orderEdit.vue

@@ -557,14 +557,14 @@
 				</el-scrollbar>
 			</el-col>
 		</el-row>
-		<!-- 拓展表单 -->
-		<ExpandForm ref="ExpandFormRef" @saveExpandForm="saveExpandForm" v-if="state.expandFormMounted" />
-		<!-- 历史工单 -->
-		<History ref="HistoryOrderRef" @saveSelect="saveSelect" />
-		<!-- 提交流程 -->
-		<Process ref="processRef" @submitProcessSuccess="submitProcessSuccess" />
-		<!-- 补充信息 -->
-		<Supply ref="SupplyRef" @onSupplySubmit="onSupplySubmit" />
+    <!-- 拓展表单 -->
+    <order-expand-form ref="ExpandFormRef" @saveExpandForm="saveExpandForm" />
+    <!-- 历史工单 -->
+    <order-history ref="HistoryOrderRef" @saveSelect="saveSelect" />
+    <!-- 提交流程 -->
+    <order-process ref="processRef" @orderProcessSuccess="orderProcessSuccess" />
+    <!-- 补充信息 -->
+    <order-supply ref="SupplyRef" @onSupplySuccess="onSupplySuccess" />
 	</div>
 </template>
 
@@ -585,11 +585,11 @@ import { auth } from '/@/utils/authFunction';
 import mittBus from '/@/utils/mitt';
 
 // 引入组件
-const Process = defineAsyncComponent(() => import('/@/views/business/order/components/Order-process.vue'));
-const ExpandForm = defineAsyncComponent(() => import('/@/views/business/order/components/Order-expand-form.vue'));
-const History = defineAsyncComponent(() => import('/@/views/business/order/components/order-history.vue'));
+const OrderProcess = defineAsyncComponent(() => import('/@/views/business/order/components/Order-process.vue'));
+const OrderExpandForm = defineAsyncComponent(() => import('/@/views/business/order/components/Order-expand-form.vue'));
+const OrderHistory = defineAsyncComponent(() => import('/src/views/business/order/components/Order-history.vue'));
 const Comment = defineAsyncComponent(() => import('/@/views/business/order/components/Order-comment.vue'));
-const Supply = defineAsyncComponent(() => import('/@/views/business/order/components/Order-supply.vue'));
+const OrderSupply = defineAsyncComponent(() => import('/@/views/business/order/components/Order-supply.vue'));
 const Upload = defineAsyncComponent(() => import('/@/components/Upload/index.vue'));
 // 定义变量内容
 const state = reactive<any>({
@@ -911,7 +911,7 @@ const searchKnowledge = (value?: string) => {
 	state.historyOrderLoading = false;
 };
 // 流程提交成功
-const submitProcessSuccess = () => {
+const orderProcessSuccess = () => {
 	// 关闭当前 tagsView
 	mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
 	mittBus.emit('clearCache', 'order');
@@ -959,7 +959,7 @@ const onSupply = (val: any) => {
 	SupplyRef.value.openDialog(val);
 };
 // 补充意见提交成功
-const onSupplySubmit = () => {
+const onSupplySuccess = () => {
 	searchHistory();
 };
 onMounted(async () => {

src/views/business/order/accept/repeatOrderDetail.vue

@@ -255,7 +255,7 @@
 		</el-card>
 
 		<!-- 扩展信息 -->
-		<ExpandForm ref="ExpandFormRef" />
+		<order-expand-detail ref="ExpandDetailRef" />
 	</div>
 </template>
 
@@ -268,7 +268,7 @@ import { formatDate } from '/@/utils/formatTime';
 import { upNumber } from '/@/utils/tools';
 
 // 引入组件
-const ExpandForm = defineAsyncComponent(() => import('/@/views/business/order/components/Order-expand-detail.vue'));
+const OrderExpandDetail = defineAsyncComponent(() => import('/@/views/business/order/components/Order-expand-detail.vue'));
 // const AudioPlayer = defineAsyncComponent(() => import('/@/components/AudioPlayer/index.vue'));
 
 // 定义变量内容
@@ -307,7 +307,7 @@ const state = reactive<any>({
 	orderId: '',
 });
 const ruleFormRef = ref<RefType>();
-const ExpandFormRef = ref<RefType>();
+const ExpandDetailRef = ref<RefType>();
 const route = useRoute();
 const router = useRouter();
 // 查看详情
@@ -339,7 +339,7 @@ const showExpandInfo = () => {
 		form.orderTypeText = '12315市场监管局受理单';
 		form.acceptTypeText = '投诉';
 	}
-	ExpandFormRef.value.openDialog(form);
+  ExpandDetailRef.value.openDialog(form);
 };
 // 展示重复工单详情
 const showDuplicateInf = () => {

src/views/business/order/components/Order-circulation-record.vue

@@ -12,7 +12,7 @@
 						</el-col>
 					</el-row>
 				</el-form>
-				<TimeLine :data="state.traces" defaultExpandAll/>
+				<process-time-line :data="state.traces" defaultExpandAll/>
 			</div>
 			<template #footer>
 				<span class="dialog-footer">
@@ -27,7 +27,7 @@
 import { reactive, ref, defineAsyncComponent } from 'vue';
 import { workflowTraces } from '/@/api/system/workflow';
 
-const TimeLine = defineAsyncComponent(() => import('/@/components/TimeLine/index.vue'));
+const ProcessTimeLine = defineAsyncComponent(() => import('/src/components/ProcessTimeLine/index.vue'));
 
 // 定义变量内容
 const state = reactive<any>({

src/views/business/order/components/Order-comment.vue

@@ -43,7 +43,7 @@
 								v-for="(item, index) in state.commentsList"
 								:class="[item.ischeck === true ? 'chose' : '']"
 								:key="index"
-								@click="handelComment(item, index)"
+								@click="handelComment(item, <number>index)"
 							>
 								<p class="text-ellipsis2" :title="item.content">{{ item.content }}</p>
 								<el-checkbox v-model="item.ischeck" class="check-icon" label="" v-if="item.ischeck" size="large" />

src/views/business/order/components/Order-delay.vue

@@ -0,0 +1,213 @@
+<template>
+  <el-dialog v-model="state.isShowDialog" draggable title="工单延期" ref="dialogRef" width="80%" append-to-body destroy-on-close>
+    <!-- 工单发 -->
+    <el-collapse v-model="state.collapseArr" class="collapse-box" v-loading="state.loading">
+      <!-- 工单信息 -->
+      <el-collapse-item name="1">
+        <template #title>
+          <p class="pl20">
+            <b class="font14">工单信息</b>
+          </p>
+        </template>
+        <div class="collapse-container pb1">
+          <!--  待回访进行操作 -->
+          <el-form label-width="100px" ref="ruleFormRef">
+            <el-row :gutter="35">
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
+                <el-form-item label="来电/来信人"> {{ state.ruleForm.channelText }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
+                <el-form-item label="联系电话">
+                  {{ state.ruleForm.fromPhone }}
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
+                <el-form-item label="服务坐席"> {{ state.ruleForm.employeeName }}[{{ state.ruleForm.employeeStaffNo }}] </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="热点分类"> {{ state.ruleForm.hotspotSpliceName }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="工单标题"> {{ state.ruleForm.title }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="诉求详情"> {{ state.ruleForm.content }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="接办部门"> {{ state.ruleForm.content }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="办理结果"> {{ state.ruleForm.content }} </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+      </el-collapse-item>
+      <!-- 工单延期 -->
+      <el-collapse-item name="2">
+        <template #title>
+          <p class="pl20">
+            <b class="font14">延期信息</b>
+          </p>
+        </template>
+        <div class="collapse-container pb1">
+          <el-form label-width="100px" ref="ruleFormRef" :model="state.ruleForm"  label-position="left">
+            <el-row :gutter="35">
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="操作人">
+                  {{ state.ruleForm.title }}
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="撤销说明">
+                  <el-input type="textarea" :autosize="{ minRows: 6, maxRows: 10 }" maxlength="2000" placeholder="请填写撤销说明" v-model="state.ruleForm.handleResult"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="附件" prop="additions">
+                  <Upload :fileList="state.fileList" />
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+      </el-collapse-item>
+    </el-collapse>
+
+    <template #footer>
+			<span class="dialog-footer">
+				<el-button type="primary" @click="onSubmit" :loading="state.loading" v-auth="'business:order:delay'">提交</el-button>
+			</span>
+    </template>
+  </el-dialog>
+  <!-- 处理流程 -->
+  <order-process ref="orderProcessRef" @orderProcessSuccess="orderProcessSuccess" @orderProcessFailed="orderProcessFailed" />
+</template>
+<script setup lang="ts" name="orderDelay">
+import {defineAsyncComponent, reactive, ref} from 'vue';
+import {ElMessageBox} from 'element-plus'
+import {commonEnum} from "/@/utils/tools";
+
+// 引入组件
+const Upload = defineAsyncComponent(() => import('/@/components/Upload/index.vue'));
+const OrderProcess = defineAsyncComponent(() => import('/@/views/business/order/components/Order-process.vue'));
+
+// 定义子组件向父组件传值/事件
+const emit = defineEmits(['OnDelaySuccess', 'OnDelayFailed']);
+// 定义变量内容
+const state = reactive<any>({
+  collapseArr:['1','2'], // 折叠面板
+  isShowDialog: false, // 是否显示弹窗
+  loading: false, // 是否显示加载
+  ruleForm: {// 表单数据
+    title:"标题内容",
+    content:"内容内容内容内容内容内容内容内容内容内容内容内容内容",
+    result:'办理结果内容',
+    handleResult:'办理结果内容',
+    radio1:'1',
+    departmentList:[
+      {
+        departmentName:'部门名称1',
+        radio:'1',
+      },
+      {
+        departmentName:'部门名称2',
+        radio:'1',
+      },
+      {
+        departmentName:'部门名称3',
+        radio:'1',
+      },
+    ]
+  },
+  fileList:[],
+});
+const ruleFormRef = ref<RefType>();
+const orderProcessRef = ref<RefType>();
+// 打开弹窗
+const openDialog = (val:any) => {
+  console.log(val,'撤销参数')
+  state.loading = false;
+  state.isShowDialog = true;
+};
+// 关闭弹窗
+const closeDialog = () => {
+  state.isShowDialog = false;
+  state.ruleForm = {};
+};
+// 提交
+const onSubmit = () => {
+  ElMessageBox.confirm('您确定要申请延期吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning',
+  })
+      .then(() => {
+        orderProcessRef.value.openDialog({ id: state.ruleForm.workflowId, title: '延期', processType: 'delay', commonEnum: commonEnum.Delay });
+      })
+      .catch(() => {
+        // 取消
+      });
+};
+// 流程提交成功
+const orderProcessSuccess = () => {
+  closeDialog();
+  emit('OnDelaySuccess');
+};
+// 流程提交失败
+const orderProcessFailed = () => {
+  closeDialog();
+  emit('OnDelayFailed');
+};
+defineExpose({
+  openDialog,
+  closeDialog,
+});
+</script>
+
+<style lang="scss" scoped>
+.collapse-box {
+  :deep(.el-collapse-item__header) {
+    background-color: var(--hotline-bg-main-color);
+    height: 40px;
+    border-radius: var(--el-border-radius-base);
+  }
+  :deep(.el-collapse-item__content) {
+    padding-bottom: 10px !important;
+    .el-form-item {
+      margin-bottom: 5px;
+      .el-form-item__content {
+        line-height: 24px;
+      }
+    }
+  }
+  .collapse-container {
+    padding: 10px;
+    .plug-container {
+      border: var(--el-border);
+      border-radius: var(--el-border-radius-base);
+      margin-bottom: 15px;
+      &:last-child {
+        margin-bottom: 0;
+      }
+      .plug-container-title {
+        padding: 10px 15px;
+        font-weight: bold;
+        border-bottom: var(--el-border);
+        font-size: var(--el-font-size-medium);
+      }
+    }
+  }
+}
+</style>
+<style lang="scss">
+.demo-tabs-form {
+  .title {
+    font-size: var(--el-font-size-medium);
+    padding: 10px 15px 20px 15px;
+  }
+  .el-form-item {
+    margin-bottom: 0 !important;
+  }
+}
+</style>

src/views/business/order/components/Order-detail.vue

@@ -271,13 +271,13 @@
 						v-auth="'system:workflow:handle'"
 						>办 理</el-button
 					>
-					<!-- <el-button type="primary" @click="onSubmit('延期')" v-if="state.ruleForm.status != 60 && state.workflow.canHandle" :loading="state.loading">延 期</el-button> -->
+          <el-button type="primary" @click="onDelay" v-auth="'business:order:delay'" :loading="state.loading">延 期</el-button>
 					<!-- 流程结束之后不展示补充按钮 -->
-					<el-button type="primary" @click="onSupply" :loading="state.loading" v-if="state.workflow.status === 0" v-auth="'system:workflow:supply'"
+					<el-button type="primary" @click="onSupply" :loading="state.loading" v-if="state.workflow.status === 0" v-auth="'business:order:supply'"
 						>补 充</el-button
 					>
-					<!-- <el-button type="primary" @click="onSubmit('督办')" :loading="state.loading" v-if="state.ruleForm.status == 0">督 办</el-button> -->
-					<!-- <el-button type="primary" @click="onSubmit('撤销')" :loading="state.loading" v-if="state.ruleForm.status == 0">撤 销</el-button> -->
+          <el-button type="primary" @click="onSupervise" :loading="state.loading" v-auth="'business:order:supervise'">督 办</el-button>
+          <el-button type="primary" @click="onRevoke" :loading="state.loading"  v-auth="'business:order:revoke'">撤 销</el-button>
 					<!-- 工单未归档都可以撤回 -->
 					<el-button
 						type="primary"
@@ -300,13 +300,19 @@
 			</template>
 		</el-dialog>
 		<!-- 处理流程 -->
-		<order-process ref="OrderProcessRef" @submitProcessSuccess="submitProcessSuccess" @submitProcessFailed="submitProcessFailed" />
+		<order-process ref="OrderProcessRef" @orderProcessSuccess="orderProcessSuccess" @orderProcessFailed="orderProcessFailed" />
 		<!-- 扩展信息 -->
 		<order-expand-detail ref="OrderExpandDetailRef" />
 		<!-- 流转记录 -->
-		<order-circulation-record ref="OrderCirculationRecordRef" />
-		<!-- 补充信息 -->
-		<order-supply ref="OrderSupplyRef" @onSupplySubmit="onSupplySubmit" />
+		<order-circulation-record ref="orderCirculationRecordRef" />
+		<!-- 工单补充 -->
+		<order-supply ref="orderSupplyRef" @onSupplySuccess="onSupplySuccess" />
+    <!-- 工单撤销 -->
+    <order-revoke ref="orderRevokeRef" @onRevokeSuccess="onRevokeSuccess" />
+    <!-- 工单延期 -->
+    <order-delay ref="OrderDelayRef" @OnDelaySuccess="OnDelaySuccess" />
+    <!-- 工单督办 -->
+    <order-super-vise ref="orderSuperviseRef" @onSuperviseSuccess="onSuperviseSuccess" />
 	</div>
 </template>
 
@@ -322,6 +328,9 @@ const OrderExpandDetail = defineAsyncComponent(() => import('/@/views/business/o
 const OrderCirculationRecord = defineAsyncComponent(() => import('/@/views/business/order/components/Order-circulation-record.vue'));
 const OrderProcess = defineAsyncComponent(() => import('/@/views/business/order/components/Order-process.vue'));
 const OrderSupply = defineAsyncComponent(() => import('/@/views/business/order/components/Order-supply.vue'));
+const OrderRevoke = defineAsyncComponent(() => import('/@/views/business/order/components/Order-revoke.vue'));
+const OrderDelay = defineAsyncComponent(() => import('/@/views/business/order/components/Order-delay.vue'));
+const OrderSuperVise = defineAsyncComponent(() => import('/@/views/business/order/components/Order-supervise.vue'));
 // const AudioPlayer = defineAsyncComponent(() => import('/@/components/AudioPlayer/index.vue'));
 
 // 定义子组件向父组件传值/事件
@@ -372,10 +381,13 @@ const state = reactive<any>({
 	orderId: '',
 });
 const ruleFormRef = ref<RefType>();
-const OrderProcessRef = ref<RefType>();
-const OrderExpandDetailRef = ref<RefType>();
-const OrderCirculationRecordRef = ref<RefType>();
-const OrderSupplyRef = ref<RefType>();
+const OrderProcessRef = ref<RefType>(); // 处理流程
+const orderExpandDetailRef = ref<RefType>(); // 扩展信息
+const orderCirculationRecordRef = ref<RefType>(); // 流转记录
+const orderSupplyRef = ref<RefType>(); // 工单补充
+const orderRevokeRef = ref<RefType>(); // 工单撤销
+const OrderDelayRef = ref<RefType>(); // 工单延期
+const orderSuperviseRef = ref<RefType>(); // 工单督办
 const router = useRouter();
 // 打开弹窗
 const openDialog = (val: any) => {
@@ -411,7 +423,7 @@ const showExpandInfo = () => {
 		form.orderTypeText = '12315市场监管局受理单';
 		form.acceptTypeText = '投诉';
 	}
-	OrderExpandDetailRef.value.openDialog(form);
+  orderExpandDetailRef.value.openDialog(form);
 };
 // 展示重复工单详情
 const showDuplicateInfo = () => {
@@ -434,31 +446,55 @@ const closeDialog = () => {
 // };
 // 流转记录
 const onRecord = () => {
-	OrderCirculationRecordRef.value.openDialog(state.ruleForm);
+  orderCirculationRecordRef.value.openDialog(state.ruleForm);
 };
 // 办理 下一步
 const onSubmit = throttle((val: string, type?: string) => {
 	OrderProcessRef.value.openDialog({ id: state.ruleForm.workflowId, title: val, processType: type, commonEnum: commonEnum.OrderCirculation });
 }, 1000);
+// 流程提交成功
+const orderProcessSuccess = () => {
+  closeDialog();
+  emit('updateList');
+};
+// 流程提交失败
+const orderProcessFailed = () => {
+  closeDialog();
+  emit('updateList');
+};
 // 补充信息
 const onSupply = () => {
 	// 穿入当前流程id
-	OrderSupplyRef.value.openDialog(state.ruleForm);
+  orderSupplyRef.value.openDialog(state.ruleForm);
 };
 // 补充意见提交成功
-const onSupplySubmit = () => {
+const onSupplySuccess = () => {
 	getDetail(state.orderId);
 };
-// 流程提交成功
-const submitProcessSuccess = () => {
-	closeDialog();
-	emit('updateList');
-};
-// 流程提交失败
-const submitProcessFailed = () => {
-	closeDialog();
-	emit('updateList');
+// 延期
+const onDelay = () => {
+  OrderDelayRef.value.openDialog(state.ruleForm);
 };
+// 延期提交成功
+const OnDelaySuccess = ()=>{
+  getDetail(state.orderId);
+}
+// 撤销
+const onRevoke = ()=>{
+  orderRevokeRef.value.openDialog(state.ruleForm);
+}
+// 撤销提交成功
+const onRevokeSuccess = ()=>{
+  getDetail(state.orderId);
+}
+// 督办
+const onSupervise = ()=>{
+  orderSuperviseRef.value.openDialog(state.ruleForm);
+}
+// 督办提交成功
+const onSuperviseSuccess = ()=>{
+  getDetail(state.orderId);
+}
 // 暴露变量
 defineExpose({
 	openDialog,

src/views/business/order/components/order-history.vue → src/views/business/order/components/Order-history.vue

@@ -43,6 +43,14 @@
 							<span style="color: var(--el-color-info)" v-if="row.status === 60">{{ row.statusText }}</span>
 						</template>
 					</el-table-column>
+          <el-table-column label="操作" width="150" fixed="right" align="center">
+            <!-- 草稿0 status 可以删除 -->
+            <template #default="{ row }">
+<!--              <el-button type="primary" link @click="onSupply" :loading="state.loading"  v-auth="'system:workflow:supply'">督办</el-button>-->
+              <el-button type="primary" link @click="onSupply(row)" :loading="state.loading"  v-auth="'business:order:supply'">补充</el-button>
+              <el-button type="primary" link @click="onRevoke(row)" :loading="state.loading"  v-auth="'business:order:revoke'">撤销</el-button>
+            </template>
+          </el-table-column>
 					<template #empty>
 						<Empty />
 					</template>
@@ -62,15 +70,22 @@
 				</span>
 			</template>
 		</el-dialog>
+    <!-- 工单补充 -->
+    <order-supply ref="orderSupplyRef" @onSupplySuccess="onSupplySuccess" />
+    <!-- 工单撤销 -->
+    <order-revoke ref="orderRevokeRef" @onRevokeSuccess="onRevokeSuccess" />
 	</div>
 </template>
 
 <script setup lang="ts" name="orderHistory">
-import { reactive, ref } from 'vue';
+import {defineAsyncComponent, reactive, ref} from 'vue';
 import type { FormInstance } from 'element-plus';
 import { historyOrder } from '/@/api/business/order';
 import { useRoute } from 'vue-router';
 // import { ElMessage } from 'element-plus';
+// 引入组件
+const OrderSupply = defineAsyncComponent(() => import('/@/views/business/order/components/Order-supply.vue'));
+const OrderRevoke = defineAsyncComponent(() => import('/@/views/business/order/components/Order-revoke.vue'));
 const emit = defineEmits(['saveSelect']);
 // 定义变量内容
 const state = reactive<any>({
@@ -88,6 +103,8 @@ const state = reactive<any>({
 	ruleForm: {},
 });
 const ruleFormRef = ref<RefType>();
+const orderSupplyRef = ref<RefType>()
+const orderRevokeRef = ref<RefType>()
 const route = useRoute();
 // 打开弹窗
 const openDialog = (row: any) => {
@@ -131,6 +148,7 @@ const getList = () => {
 			state.loading = false;
 		});
 };
+// 选择重复件
 const handleSelectionChange = (row: any) => {
 	if (row) {
 		state.tableRadio = row.id;
@@ -141,6 +159,29 @@ const handleRowChange = (row: any) => {
 	state.tableRadio = row.id;
 	state.selectRow = row;
 };
+// 补充
+const onSupply = (row: any) => {
+  // 穿入当前流程id
+  orderSupplyRef.value.openDialog(row);
+};
+// 补充意见提交成功
+const onSupplySuccess = () => {
+  // 关闭弹窗
+  orderSupplyRef.value.closeDialog();
+  // 刷新列表
+  getList();
+};
+// 撤销
+const onRevoke = (row: any)=>{
+  orderRevokeRef.value.openDialog(row);
+}
+// 撤销提交成功
+const onRevokeSuccess = ()=>{
+  // 关闭弹窗
+  orderRevokeRef.value.closeDialog();
+  // 刷新列表
+  getList();
+}
 // 确定选择历史工单
 const selectConfirm = () => {
 	emit('saveSelect', state.selectRow);

src/views/business/order/components/Order-process.vue

@@ -93,7 +93,7 @@ import { workflowNextSteps, workflowNext, workflowRecall, workflowPrevious, work
 const Comment = defineAsyncComponent(() => import('/@/views/business/order/components/Order-comment.vue'));
 const Upload = defineAsyncComponent(() => import('/@/components/Upload/index.vue'));
 // 定义子组件向父组件传值/事件
-const emit = defineEmits(['submitProcessSuccess', 'submitProcessFailed']);
+const emit = defineEmits(['orderProcessSuccess', 'orderProcessFailed']);
 // 定义变量内容
 const state = reactive<any>({
 	isShowDialog: false,
@@ -158,7 +158,25 @@ const openDialog = async (val: any) => {
 				state.ruleForm.nextStepCode = state.nextStepOptions[0].key;
 				getNextStepOption(res.result.id, state.nextStepOptions[0].key);
 			}
-			break;
+			break
+    case 'delay': // 延期
+      res = await workflowNextSteps(state.workflowId);
+      state.nextStepOptions = res.result.steps;
+      state.handleId = res.result.id;
+      if (state.nextStepOptions.length === 1) {
+        state.ruleForm.nextStepCode = state.nextStepOptions[0].key;
+        getNextStepOption(res.result.id, state.nextStepOptions[0].key);
+      }
+      break;
+    case 'supervise': // 督办
+      res = await workflowNextSteps(state.workflowId);
+      state.nextStepOptions = res.result.steps;
+      state.handleId = res.result.id;
+      if (state.nextStepOptions.length === 1) {
+        state.ruleForm.nextStepCode = state.nextStepOptions[0].key;
+        getNextStepOption(res.result.id, state.nextStepOptions[0].key);
+      }
+      break;
 
 		default: // 默认下一流程
 			res = await workflowNextSteps(state.workflowId);
@@ -261,7 +279,7 @@ const onSubmit = () => {
 									ElMessage.success('操作成功');
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessSuccess');
+									emit('orderProcessSuccess');
 								})
 								.catch(() => {
 									state.loading = false;
@@ -274,12 +292,12 @@ const onSubmit = () => {
 									ElMessage.success('操作成功');
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessSuccess');
+									emit('orderProcessSuccess');
 								})
 								.catch(() => {
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessFailed');
+									emit('orderProcessFailed');
 								});
 							break;
 						case 'return': // 退回流程
@@ -288,12 +306,12 @@ const onSubmit = () => {
 									ElMessage.success('操作成功');
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessSuccess');
+									emit('orderProcessSuccess');
 								})
 								.catch(() => {
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessFailed');
+									emit('orderProcessFailed');
 								});
 							break;
 						case 'next': // 默认下一流程
@@ -302,12 +320,12 @@ const onSubmit = () => {
 									ElMessage.success('操作成功');
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessSuccess');
+									emit('orderProcessSuccess');
 								})
 								.catch(() => {
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessFailed');
+									emit('orderProcessFailed');
 								});
 							break;
 						default: // 默认下一流程
@@ -316,12 +334,12 @@ const onSubmit = () => {
 									ElMessage.success('操作成功');
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessSuccess');
+									emit('orderProcessSuccess');
 								})
 								.catch(() => {
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessFailed');
+									emit('orderProcessFailed');
 								});
 							break;
 					}

src/views/business/order/components/Order-revoke.vue

@@ -0,0 +1,203 @@
+<template>
+  <el-dialog v-model="state.isShowDialog" draggable title="工单撤销" ref="dialogRef" width="80%" append-to-body destroy-on-close>
+    <!-- 工单发 -->
+    <el-collapse v-model="state.collapseArr" class="collapse-box" v-loading="state.loading">
+      <!-- 工单信息 -->
+      <el-collapse-item name="1">
+        <template #title>
+          <p class="pl20">
+            <b class="font14">工单信息</b>
+          </p>
+        </template>
+        <div class="collapse-container pb1">
+          <!--  待回访进行操作 -->
+          <el-form label-width="100px" ref="ruleFormRef">
+            <el-row :gutter="35">
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
+                <el-form-item label="来电/来信人"> {{ state.ruleForm.channelText }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
+                <el-form-item label="联系电话">
+                  {{ state.ruleForm.fromPhone }}
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
+                <el-form-item label="服务坐席"> {{ state.ruleForm.employeeName }}[{{ state.ruleForm.employeeStaffNo }}] </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="热点分类"> {{ state.ruleForm.hotspotSpliceName }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="工单标题"> {{ state.ruleForm.title }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="诉求详情"> {{ state.ruleForm.content }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="接办部门"> {{ state.ruleForm.content }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="办理结果"> {{ state.ruleForm.content }} </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+      </el-collapse-item>
+      <!-- 发布详情 -->
+      <el-collapse-item name="2">
+        <template #title>
+          <p class="pl20">
+            <b class="font14">撤销信息</b>
+          </p>
+        </template>
+        <div class="collapse-container pb1">
+          <el-form label-width="100px" ref="ruleFormRef" :model="state.ruleForm"  label-position="left">
+            <el-row :gutter="35">
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="操作人">
+                  {{ state.ruleForm.title }}
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="撤销说明">
+                  <el-input type="textarea" :autosize="{ minRows: 6, maxRows: 10 }" maxlength="2000" placeholder="请填写撤销说明" v-model="state.ruleForm.handleResult"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="附件" prop="additions">
+                  <Upload :fileList="state.fileList" />
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+      </el-collapse-item>
+    </el-collapse>
+
+    <template #footer>
+			<span class="dialog-footer">
+				<el-button type="primary" @click="onSubmit" :loading="state.loading" v-auth="'business:order:revoke'">提交</el-button>
+			</span>
+    </template>
+  </el-dialog>
+</template>
+<script setup lang="ts" name="orderRevoke">
+import {defineAsyncComponent, reactive, ref} from 'vue';
+import {ElMessageBox} from 'element-plus'
+
+// 引入组件
+const Upload = defineAsyncComponent(() => import('/@/components/Upload/index.vue'));
+
+// 定义子组件向父组件传值/事件
+const emit = defineEmits(['onRevokeSuccess']);
+// 定义变量内容
+const state = reactive<any>({
+  collapseArr:['1','2'], // 折叠面板
+  isShowDialog: false, // 是否显示弹窗
+  loading: false, // 是否显示加载
+  ruleForm: {// 表单数据
+    title:"标题内容",
+    content:"内容内容内容内容内容内容内容内容内容内容内容内容内容",
+    result:'办理结果内容',
+    handleResult:'办理结果内容',
+    radio1:'1',
+    departmentList:[
+      {
+        departmentName:'部门名称1',
+        radio:'1',
+      },
+      {
+        departmentName:'部门名称2',
+        radio:'1',
+      },
+      {
+        departmentName:'部门名称3',
+        radio:'1',
+      },
+    ]
+  },
+  fileList:[],
+});
+const ruleFormRef = ref<RefType>();
+// 打开弹窗
+const openDialog = (val:any) => {
+  console.log(val,'撤销参数')
+  state.loading = false;
+  state.isShowDialog = true;
+};
+// 关闭弹窗
+const closeDialog = () => {
+  state.isShowDialog = false;
+  state.ruleForm = {};
+};
+// 提交
+const onSubmit = () => {
+  ElMessageBox.confirm('您确定要撤销吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning',
+  })
+      .then(() => {
+        state.loading = true;
+        setTimeout(() => {
+          state.loading = false;
+          state.isShowDialog = false;
+          emit('onRevokeSuccess');
+        }, 1000);
+      })
+      .catch(() => {
+        // 取消
+      });
+};
+defineExpose({
+  openDialog,
+  closeDialog,
+});
+</script>
+
+<style lang="scss" scoped>
+.collapse-box {
+  :deep(.el-collapse-item__header) {
+    background-color: var(--hotline-bg-main-color);
+    height: 40px;
+    border-radius: var(--el-border-radius-base);
+  }
+  :deep(.el-collapse-item__content) {
+    padding-bottom: 10px !important;
+    .el-form-item {
+      margin-bottom: 5px;
+      .el-form-item__content {
+        line-height: 24px;
+      }
+    }
+  }
+  .collapse-container {
+    padding: 10px;
+    .plug-container {
+      border: var(--el-border);
+      border-radius: var(--el-border-radius-base);
+      margin-bottom: 15px;
+      &:last-child {
+        margin-bottom: 0;
+      }
+      .plug-container-title {
+        padding: 10px 15px;
+        font-weight: bold;
+        border-bottom: var(--el-border);
+        font-size: var(--el-font-size-medium);
+      }
+    }
+  }
+}
+</style>
+<style lang="scss">
+.demo-tabs-form {
+  .title {
+    font-size: var(--el-font-size-medium);
+    padding: 10px 15px 20px 15px;
+  }
+  .el-form-item {
+    margin-bottom: 0 !important;
+  }
+}
+</style>

src/views/business/order/components/Order-supervise.vue

@@ -0,0 +1,213 @@
+<template>
+  <el-dialog v-model="state.isShowDialog" draggable title="工单督办" ref="dialogRef" width="80%" append-to-body destroy-on-close>
+    <!-- 工单发 -->
+    <el-collapse v-model="state.collapseArr" class="collapse-box" v-loading="state.loading">
+      <!-- 工单信息 -->
+      <el-collapse-item name="1">
+        <template #title>
+          <p class="pl20">
+            <b class="font14">工单信息</b>
+          </p>
+        </template>
+        <div class="collapse-container pb1">
+          <!--  待回访进行操作 -->
+          <el-form label-width="100px" ref="ruleFormRef">
+            <el-row :gutter="35">
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
+                <el-form-item label="来电/来信人"> {{ state.ruleForm.channelText }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="8">
+                <el-form-item label="联系电话">
+                  {{ state.ruleForm.fromPhone }}
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
+                <el-form-item label="服务坐席"> {{ state.ruleForm.employeeName }}[{{ state.ruleForm.employeeStaffNo }}] </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="热点分类"> {{ state.ruleForm.hotspotSpliceName }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="工单标题"> {{ state.ruleForm.title }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="诉求详情"> {{ state.ruleForm.content }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="接办部门"> {{ state.ruleForm.content }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="办理结果"> {{ state.ruleForm.content }} </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+      </el-collapse-item>
+      <!-- 工单督办 -->
+      <el-collapse-item name="2">
+        <template #title>
+          <p class="pl20">
+            <b class="font14">督办信息</b>
+          </p>
+        </template>
+        <div class="collapse-container pb1">
+          <el-form label-width="100px" ref="ruleFormRef" :model="state.ruleForm"  label-position="left">
+            <el-row :gutter="35">
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="操作人">
+                  {{ state.ruleForm.title }}
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="撤销说明">
+                  <el-input type="textarea" :autosize="{ minRows: 6, maxRows: 10 }" maxlength="2000" placeholder="请填写撤销说明" v-model="state.ruleForm.handleResult"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+                <el-form-item label="附件" prop="additions">
+                  <Upload :fileList="state.fileList" />
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+      </el-collapse-item>
+    </el-collapse>
+
+    <template #footer>
+			<span class="dialog-footer">
+				<el-button type="primary" @click="onSubmit" :loading="state.loading" v-auth="'business:order:supervise'">提交</el-button>
+			</span>
+    </template>
+  </el-dialog>
+  <!-- 处理流程 -->
+  <order-process ref="orderProcessRef" @orderProcessSuccess="orderProcessSuccess" @orderProcessFailed="orderProcessFailed" />
+</template>
+<script setup lang="ts" name="orderSupervise">
+import {defineAsyncComponent, reactive, ref} from 'vue';
+import {ElMessageBox} from 'element-plus'
+import {commonEnum} from "/@/utils/tools";
+
+// 引入组件
+const Upload = defineAsyncComponent(() => import('/@/components/Upload/index.vue'));
+const OrderProcess = defineAsyncComponent(() => import('/@/views/business/order/components/Order-process.vue'));
+
+// 定义子组件向父组件传值/事件
+const emit = defineEmits(['onSuperviseSuccess', 'onSuperviseFailed']);
+// 定义变量内容
+const state = reactive<any>({
+  collapseArr:['1','2'], // 折叠面板
+  isShowDialog: false, // 是否显示弹窗
+  loading: false, // 是否显示加载
+  ruleForm: {// 表单数据
+    title:"标题内容",
+    content:"内容内容内容内容内容内容内容内容内容内容内容内容内容",
+    result:'办理结果内容',
+    handleResult:'办理结果内容',
+    radio1:'1',
+    departmentList:[
+      {
+        departmentName:'部门名称1',
+        radio:'1',
+      },
+      {
+        departmentName:'部门名称2',
+        radio:'1',
+      },
+      {
+        departmentName:'部门名称3',
+        radio:'1',
+      },
+    ]
+  },
+  fileList:[],
+});
+const ruleFormRef = ref<RefType>();
+const orderProcessRef = ref<RefType>();
+// 打开弹窗
+const openDialog = (val:any) => {
+  console.log(val,'撤销参数')
+  state.loading = false;
+  state.isShowDialog = true;
+};
+// 关闭弹窗
+const closeDialog = () => {
+  state.isShowDialog = false;
+  state.ruleForm = {};
+};
+// 提交
+const onSubmit = () => {
+  ElMessageBox.confirm('您确定要申请督办吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning',
+  })
+      .then(() => {
+        orderProcessRef.value.openDialog({ id: state.ruleForm.workflowId, title: '延期', processType: 'supervise', commonEnum: commonEnum.Supervise });
+      })
+      .catch(() => {
+        // 取消
+      });
+};
+// 督办成功
+const orderProcessSuccess = () => {
+  closeDialog();
+  emit('onSuperviseSuccess');
+};
+// 督办失败
+const orderProcessFailed = () => {
+  closeDialog();
+  emit('onSuperviseFailed');
+};
+defineExpose({
+  openDialog,
+  closeDialog,
+});
+</script>
+
+<style lang="scss" scoped>
+.collapse-box {
+  :deep(.el-collapse-item__header) {
+    background-color: var(--hotline-bg-main-color);
+    height: 40px;
+    border-radius: var(--el-border-radius-base);
+  }
+  :deep(.el-collapse-item__content) {
+    padding-bottom: 10px !important;
+    .el-form-item {
+      margin-bottom: 5px;
+      .el-form-item__content {
+        line-height: 24px;
+      }
+    }
+  }
+  .collapse-container {
+    padding: 10px;
+    .plug-container {
+      border: var(--el-border);
+      border-radius: var(--el-border-radius-base);
+      margin-bottom: 15px;
+      &:last-child {
+        margin-bottom: 0;
+      }
+      .plug-container-title {
+        padding: 10px 15px;
+        font-weight: bold;
+        border-bottom: var(--el-border);
+        font-size: var(--el-font-size-medium);
+      }
+    }
+  }
+}
+</style>
+<style lang="scss">
+.demo-tabs-form {
+  .title {
+    font-size: var(--el-font-size-medium);
+    padding: 10px 15px 20px 15px;
+  }
+  .el-form-item {
+    margin-bottom: 0 !important;
+  }
+}
+</style>

src/views/business/order/components/Order-supply.vue

@@ -37,7 +37,7 @@
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
-						<el-form-item label="附件" prop="additions" :rules="[{ required: false, message: '请填写诉求内容', trigger: 'change' }]">
+						<el-form-item label="附件" prop="additions">
 							<Upload :fileList="state.fileList" />
 						</el-form-item>
 					</el-col>
@@ -63,7 +63,7 @@ import { supplement } from '/@/api/system/workflow';
 const Upload = defineAsyncComponent(() => import('/@/components/Upload/index.vue'));
 
 // 定义子组件向父组件传值/事件
-const emit = defineEmits(['onSupplySubmit']);
+const emit = defineEmits(['onSupplySuccess']);
 // 定义变量内容
 const state = reactive<any>({
 	isShowDialog: false,
@@ -111,7 +111,7 @@ const onSubmit = throttle(() => {
 						.then(() => {
 							state.loading = false;
 							state.isShowDialog = false;
-							emit('onSupplySubmit');
+							emit('onSupplySuccess');
 						})
 						.catch(() => {
 							state.loading = false;

src/views/business/order/index.vue

@@ -1,270 +1,273 @@
 <template>
 	<div class="business-order-container layout-padding">
 		<div class="layout-padding-auto layout-padding-view pd20">
-			<!-- <el-tabs v-model="state.activeName" class="h100" @tab-change="handleClick"> -->
-			<!-- <el-tab-pane :name="item.value" v-for="item in state.tabPaneList" :key="item.value" :label="item.label"></el-tab-pane> -->
-			<el-form :model="state.queryParams" ref="ruleFormRef" @submit.native.prevent class="mt15" label-width="100px">
-				<el-row :gutter="10">
-					<el-col :span="8">
-						<el-form-item label="关键字" prop="Keyword">
-							<el-input v-model="state.queryParams.Keyword" placeholder="工单编码/标题" clearable @keyup.enter="queryList" />
-						</el-form-item>
-					</el-col>
-					<el-col :span="8">
-						<el-form-item label="诉求详情" prop="Content">
-							<el-input v-model="state.queryParams.Content" placeholder="诉求详情" clearable @keyup.enter="queryList" />
-						</el-form-item>
-					</el-col>
-					<transition name="el-zoom-in-top">
-						<el-col :span="8" v-show="!searchCol">
-							<el-form-item label="受理类型" prop="AcceptType">
-								<el-select v-model="state.queryParams.AcceptType" placeholder="请选择受理类型" multiple clearable class="w100">
-									<el-option v-for="item in state.acceptTypeOptions" :value="item.key" :key="item.key" :label="item.value" />
-								</el-select>
-							</el-form-item>
-						</el-col>
-					</transition>
-					<transition name="el-zoom-in-top">
-						<el-col :span="8" v-show="!searchCol">
-							<el-form-item label="来源渠道" prop="Channel">
-								<el-select v-model="state.queryParams.Channel" placeholder="请选择来源渠道" multiple clearable class="w100">
-									<el-option v-for="item in state.channelOptions" :value="item.key" :key="item.key" :label="item.value" />
-								</el-select>
-							</el-form-item>
-						</el-col>
-					</transition>
-					<transition name="el-zoom-in-top">
-						<el-col :span="8" v-show="!searchCol">
-							<el-form-item label="热点分类" prop="HotspotId">
-								<el-tree-select
-									class="w100"
-									v-model="state.queryParams.HotspotId"
-									filterable
-									clearable
-									multiple
-									:render-after-expand="false"
-									show-checkbox
-									placeholder="请选择热点分类"
-									:props="HotspotProps"
-									lazy
-									:load="load"
-									node-key="id"
-									check-strictly
-								/>
-							</el-form-item>
-						</el-col>
-					</transition>
-					<transition name="el-zoom-in-top">
-						<el-col :span="8" v-show="!searchCol">
-							<el-form-item label="部门" prop="OrgCode">
-								<el-cascader
-									:options="state.orgOptions"
-									filterable
-									:show-all-levels="false"
-									:props="{ checkStrictly: true, value: 'id', label: 'orgName', emitPath: false, multiple: true }"
-									placeholder="请选择所属部门"
-									clearable
-									class="w100"
-									v-model="state.queryParams.OrgCode"
-									ref="cascadeRef"
-									@change="getKnowledgeList"
-								>
-									<template #default="{ node, data }">
-										<span>{{ data.orgName }}</span>
-										<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
-									</template>
-								</el-cascader>
-							</el-form-item>
-						</el-col>
-					</transition>
-					<transition name="el-zoom-in-top">
-						<el-col :span="8" v-show="!searchCol">
-							<el-form-item label="受理坐席" prop="NameOrNo">
-								<el-input v-model="state.queryParams.NameOrNo" placeholder="坐席姓名/坐席工号" clearable @keyup.enter="queryList" />
-							</el-form-item>
-						</el-col>
-					</transition>
-					<transition name="el-zoom-in-top">
-						<el-col :span="8" v-show="!searchCol">
-							<el-form-item label="受理时间" prop="crTime">
-								<el-date-picker
-									v-model="state.queryParams.crTime"
-									type="datetimerange"
-									unlink-panels
-									range-separator="至"
-									start-placeholder="开始时间"
-									end-placeholder="结束时间"
-									:shortcuts="shortcuts"
-									@change="timeStartChangeCr"
-									value-format="YYYY-MM-DD[T]HH:mm:ss"
-								/>
-							</el-form-item>
-						</el-col>
-					</transition>
-					<transition name="el-zoom-in-top">
-						<el-col :span="8" v-show="!searchCol">
-							<el-form-item label="转接来源" prop="TransferPhone">
-								<el-input v-model="state.queryParams.TransferPhone" placeholder="请填写转接来源" clearable @keyup.enter="queryList" />
-							</el-form-item>
-						</el-col>
-					</transition>
-					<transition name="el-zoom-in-top">
-						<el-col :span="8" v-show="!searchCol">
-							<el-form-item label="紧急程度" prop="EmergencyLevel">
-								<el-select v-model="state.queryParams.EmergencyLevel" placeholder="请选择受理类型" multiple clearable class="w100">
-									<el-option v-for="item in state.emergencyLevelOptions" :value="item.key" :key="item.key" :label="item.value" />
-								</el-select>
-							</el-form-item>
-						</el-col>
-					</transition>
-					<transition name="el-zoom-in-top">
-						<el-col :span="8" v-show="!searchCol">
-							<el-form-item label="办理期限" prop="exTime">
-								<el-date-picker
-									v-model="state.queryParams.exTime"
-									type="datetimerange"
-									unlink-panels
-									range-separator="至"
-									start-placeholder="开始时间"
-									end-placeholder="结束时间"
-									:shortcuts="shortcuts"
-									@change="timeStartChangeEx"
-									value-format="YYYY-MM-DD[T]HH:mm:ss"
-								/>
-							</el-form-item>
-						</el-col>
-					</transition>
-					<transition name="el-zoom-in-top">
-						<el-col :span="8" v-show="!searchCol">
-							<el-form-item label="电话号码" prop="PhoneNo">
-								<el-input v-model="state.queryParams.PhoneNo" placeholder="来电号码/联系电话" clearable @keyup.enter="queryList" />
-							</el-form-item>
-						</el-col>
-					</transition>
-					<transition name="el-zoom-in-top">
-						<el-col :span="8" v-show="!searchCol">
-							<el-form-item label="推送分类" prop="PushTypeCode">
-								<el-select v-model="state.queryParams.PushTypeCode" placeholder="请选择推送分类" clearable class="w100">
-									<el-option v-for="item in state.pushTypeOptions" :value="item.dicDataValue" :key="item.dicDataValue" :label="item.dicDataName" />
-								</el-select>
-							</el-form-item>
-						</el-col>
-					</transition>
-					<transition name="el-zoom-in-top">
-						<el-col :span="8" v-show="!searchCol">
-							<el-form-item label="工单状态" prop="Status">
-								<el-select v-model="state.queryParams.Status" placeholder="请选择工单状态" multiple clearable class="w100">
-									<el-option v-for="item in state.orderStatusOptions" :value="item.key" :key="item.key" :label="item.value" />
-								</el-select>
-							</el-form-item>
-						</el-col>
-					</transition>
-					<el-col :span="8">
-						<div class="flex-end w100">
-							<el-button type="primary" @click="queryList" :loading="state.loading"> <SvgIcon name="ele-Search" class="mr5" />查询 </el-button>
-							<el-button @click="resetQuery(ruleFormRef)" v-waves class="default-button"> <SvgIcon name="ele-Refresh" class="mr5" />重置 </el-button>
-							<el-button link type="primary" @click="closeSearch">
-								{{ searchCol ? '展开' : '收起' }}
-								<SvgIcon :class="{ 'is-reverse': searchCol }" name="ele-ArrowUp" class="mr5 arrow" size="18px" />
-							</el-button>
-						</div>
-					</el-col>
-				</el-row>
-			</el-form>
-			<!-- 功能按钮 -->
-			<div class="flex-center-between mb20 mt20">
-				<div>
-					<el-button type="primary" @click="onAddWorkOrder" v-auth="'business:order:add'">
-						<SvgIcon name="ele-Plus" class="mr5" />新建工单
-					</el-button>
-				</div>
-			</div>
-			<!-- 表格 -->
-			<el-table :data="state.tableList" v-loading="state.loading" row-key="id" @sort-change="sortChange">
-				<el-table-column type="index" width="60" label="序号" />
-				<!--  sortable="custom" 工单编码排序 -->
-				<el-table-column label="工单编码" prop="no" show-overflow-tooltip width="150">
-					<template #default="{row}">
-						<span>{{ row.no }}</span>
-					</template>
-				</el-table-column>
-				<el-table-column label="标题" show-overflow-tooltip width="400">
-					<template #default="{row}">
-						<span style="color: var(--el-color-primary)">{{ row.title }}</span>
-					</template>
-				</el-table-column>
-				<el-table-column label="工单状态" show-overflow-tooltip width="100">
-					<template #default="{row}">
-						<!-- 草稿 -->
-						<span style="color: var(--el-color-info)" v-if="row.status === 0">{{ row.statusText }}</span>
-						<!-- 待签收 -->
-						<span style="color: var(--el-color-success)" v-if="row.status === 10">{{ row.statusText }}</span>
-						<!-- 办理中 -->
-						<span style="color: var(--el-color-primary)" v-if="row.status === 20">{{ row.statusText }}</span>
-						<!-- 会签中 -->
-						<span style="color: var(--el-color-primary)" v-if="row.status === 30">{{ row.statusText }}</span>
-						<!-- 退回 -->
-						<span style="color: var(--el-color-danger)" v-if="row.status === 40">{{ row.statusText }}</span>
-						<!-- 办理完成 -->
-						<span style="color: var(--el-color-success)" v-if="row.status === 50">{{ row.statusText }}</span>
-						<!-- 已归档 -->
-						<span style="color: var(--el-color-info)" v-if="row.status === 60">{{ row.statusText }}</span>
-					</template>
-				</el-table-column>
-				<el-table-column prop="currentStepName" label="当前环节" show-overflow-tooltip width="150"></el-table-column>
-				<el-table-column prop="acceptTypeText" label="受理类型" show-overflow-tooltip width="150"></el-table-column>
-				<el-table-column prop="hotspot" label="热点分类" show-overflow-tooltip width="200"></el-table-column>
-				<!--  sortable="custom" 紧急程度排序 -->
-				<el-table-column label="紧急程度" show-overflow-tooltip prop="emergencyLevelText" width="100">
-					<template #default="{row}">
+      <div class="flex-column">
+        <el-tabs v-model="state.activeName" @tab-change="handleClick">
+          <el-tab-pane :name="item.value" v-for="item in state.tabPaneList" :key="item.value" :label="item.label">
+          </el-tab-pane>
+        </el-tabs>
+        <el-form :model="state.queryParams" ref="ruleFormRef" @submit.native.prevent class="mt15" label-width="100px">
+          <el-row :gutter="10">
+            <el-col :span="8">
+              <el-form-item label="关键字" prop="Keyword">
+                <el-input v-model="state.queryParams.Keyword" placeholder="工单编码/标题" clearable @keyup.enter="queryList" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="诉求详情" prop="Content">
+                <el-input v-model="state.queryParams.Content" placeholder="诉求详情" clearable @keyup.enter="queryList" />
+              </el-form-item>
+            </el-col>
+            <transition name="el-zoom-in-top">
+              <el-col :span="8" v-show="!searchCol">
+                <el-form-item label="受理类型" prop="AcceptType">
+                  <el-select v-model="state.queryParams.AcceptType" placeholder="请选择受理类型" multiple clearable class="w100">
+                    <el-option v-for="item in state.acceptTypeOptions" :value="item.key" :key="item.key" :label="item.value" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </transition>
+            <transition name="el-zoom-in-top">
+              <el-col :span="8" v-show="!searchCol">
+                <el-form-item label="来源渠道" prop="Channel">
+                  <el-select v-model="state.queryParams.Channel" placeholder="请选择来源渠道" multiple clearable class="w100">
+                    <el-option v-for="item in state.channelOptions" :value="item.key" :key="item.key" :label="item.value" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </transition>
+            <transition name="el-zoom-in-top">
+              <el-col :span="8" v-show="!searchCol">
+                <el-form-item label="热点分类" prop="HotspotId">
+                  <el-tree-select
+                      class="w100"
+                      v-model="state.queryParams.HotspotId"
+                      filterable
+                      clearable
+                      multiple
+                      :render-after-expand="false"
+                      show-checkbox
+                      placeholder="请选择热点分类"
+                      :props="HotspotProps"
+                      lazy
+                      :load="load"
+                      node-key="id"
+                      check-strictly
+                  />
+                </el-form-item>
+              </el-col>
+            </transition>
+            <transition name="el-zoom-in-top">
+              <el-col :span="8" v-show="!searchCol">
+                <el-form-item label="部门" prop="OrgCode">
+                  <el-cascader
+                      :options="state.orgOptions"
+                      filterable
+                      :show-all-levels="false"
+                      :props="{ checkStrictly: true, value: 'id', label: 'orgName', emitPath: false, multiple: true }"
+                      placeholder="请选择所属部门"
+                      clearable
+                      class="w100"
+                      v-model="state.queryParams.OrgCode"
+                      ref="cascadeRef"
+                      @change="getKnowledgeList"
+                  >
+                    <template #default="{ node, data }">
+                      <span>{{ data.orgName }}</span>
+                      <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
+                    </template>
+                  </el-cascader>
+                </el-form-item>
+              </el-col>
+            </transition>
+            <transition name="el-zoom-in-top">
+              <el-col :span="8" v-show="!searchCol">
+                <el-form-item label="受理坐席" prop="NameOrNo">
+                  <el-input v-model="state.queryParams.NameOrNo" placeholder="坐席姓名/坐席工号" clearable @keyup.enter="queryList" />
+                </el-form-item>
+              </el-col>
+            </transition>
+            <transition name="el-zoom-in-top">
+              <el-col :span="8" v-show="!searchCol">
+                <el-form-item label="受理时间" prop="crTime">
+                  <el-date-picker
+                      v-model="state.queryParams.crTime"
+                      type="datetimerange"
+                      unlink-panels
+                      range-separator="至"
+                      start-placeholder="开始时间"
+                      end-placeholder="结束时间"
+                      :shortcuts="shortcuts"
+                      @change="timeStartChangeCr"
+                      value-format="YYYY-MM-DD[T]HH:mm:ss"
+                  />
+                </el-form-item>
+              </el-col>
+            </transition>
+            <transition name="el-zoom-in-top">
+              <el-col :span="8" v-show="!searchCol">
+                <el-form-item label="转接来源" prop="TransferPhone">
+                  <el-input v-model="state.queryParams.TransferPhone" placeholder="请填写转接来源" clearable @keyup.enter="queryList" />
+                </el-form-item>
+              </el-col>
+            </transition>
+            <transition name="el-zoom-in-top">
+              <el-col :span="8" v-show="!searchCol">
+                <el-form-item label="紧急程度" prop="EmergencyLevel">
+                  <el-select v-model="state.queryParams.EmergencyLevel" placeholder="请选择受理类型" multiple clearable class="w100">
+                    <el-option v-for="item in state.emergencyLevelOptions" :value="item.key" :key="item.key" :label="item.value" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </transition>
+            <transition name="el-zoom-in-top">
+              <el-col :span="8" v-show="!searchCol">
+                <el-form-item label="办理期限" prop="exTime">
+                  <el-date-picker
+                      v-model="state.queryParams.exTime"
+                      type="datetimerange"
+                      unlink-panels
+                      range-separator="至"
+                      start-placeholder="开始时间"
+                      end-placeholder="结束时间"
+                      :shortcuts="shortcuts"
+                      @change="timeStartChangeEx"
+                      value-format="YYYY-MM-DD[T]HH:mm:ss"
+                  />
+                </el-form-item>
+              </el-col>
+            </transition>
+            <transition name="el-zoom-in-top">
+              <el-col :span="8" v-show="!searchCol">
+                <el-form-item label="电话号码" prop="PhoneNo">
+                  <el-input v-model="state.queryParams.PhoneNo" placeholder="来电号码/联系电话" clearable @keyup.enter="queryList" />
+                </el-form-item>
+              </el-col>
+            </transition>
+            <transition name="el-zoom-in-top">
+              <el-col :span="8" v-show="!searchCol">
+                <el-form-item label="推送分类" prop="PushTypeCode">
+                  <el-select v-model="state.queryParams.PushTypeCode" placeholder="请选择推送分类" clearable class="w100">
+                    <el-option v-for="item in state.pushTypeOptions" :value="item.dicDataValue" :key="item.dicDataValue" :label="item.dicDataName" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </transition>
+            <transition name="el-zoom-in-top">
+              <el-col :span="8" v-show="!searchCol">
+                <el-form-item label="工单状态" prop="Status">
+                  <el-select v-model="state.queryParams.Status" placeholder="请选择工单状态" multiple clearable class="w100">
+                    <el-option v-for="item in state.orderStatusOptions" :value="item.key" :key="item.key" :label="item.value" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </transition>
+            <el-col :span="8">
+              <div class="flex-end w100">
+                <el-button type="primary" @click="queryList" :loading="state.loading"> <SvgIcon name="ele-Search" class="mr5" />查询 </el-button>
+                <el-button @click="resetQuery(ruleFormRef)" v-waves class="default-button"> <SvgIcon name="ele-Refresh" class="mr5" />重置 </el-button>
+                <el-button link type="primary" @click="closeSearch">
+                  {{ searchCol ? '展开' : '收起' }}
+                  <SvgIcon :class="{ 'is-reverse': searchCol }" name="ele-ArrowUp" class="mr5 arrow" size="18px" />
+                </el-button>
+              </div>
+            </el-col>
+          </el-row>
+        </el-form>
+        <!-- 功能按钮 -->
+        <div class="flex-center-between mb20 mt20">
+          <div>
+            <el-button type="primary" @click="onAddWorkOrder" v-auth="'business:order:add'">
+              <SvgIcon name="ele-Plus" class="mr5" />新建工单
+            </el-button>
+          </div>
+        </div>
+        <!-- 表格 -->
+        <el-table :data="state.tableList" v-loading="state.loading" row-key="id" @sort-change="sortChange">
+          <el-table-column type="index" width="60" label="序号" />
+          <!--  sortable="custom" 工单编码排序 -->
+          <el-table-column label="工单编码" prop="no" show-overflow-tooltip width="150">
+            <template #default="{row}">
+              <span>{{ row.no }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="标题" show-overflow-tooltip width="400">
+            <template #default="{row}">
+              <span style="color: var(--el-color-primary)">{{ row.title }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="工单状态" show-overflow-tooltip width="100">
+            <template #default="{row}">
+              <!-- 草稿 -->
+              <span style="color: var(--el-color-info)" v-if="row.status === 0">{{ row.statusText }}</span>
+              <!-- 待签收 -->
+              <span style="color: var(--el-color-success)" v-if="row.status === 10">{{ row.statusText }}</span>
+              <!-- 办理中 -->
+              <span style="color: var(--el-color-primary)" v-if="row.status === 20">{{ row.statusText }}</span>
+              <!-- 会签中 -->
+              <span style="color: var(--el-color-primary)" v-if="row.status === 30">{{ row.statusText }}</span>
+              <!-- 退回 -->
+              <span style="color: var(--el-color-danger)" v-if="row.status === 40">{{ row.statusText }}</span>
+              <!-- 办理完成 -->
+              <span style="color: var(--el-color-success)" v-if="row.status === 50">{{ row.statusText }}</span>
+              <!-- 已归档 -->
+              <span style="color: var(--el-color-info)" v-if="row.status === 60">{{ row.statusText }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="currentStepName" label="当前环节" show-overflow-tooltip width="150"></el-table-column>
+          <el-table-column prop="acceptTypeText" label="受理类型" show-overflow-tooltip width="150"></el-table-column>
+          <el-table-column prop="hotspot" label="热点分类" show-overflow-tooltip width="200"></el-table-column>
+          <!--  sortable="custom" 紧急程度排序 -->
+          <el-table-column label="紧急程度" show-overflow-tooltip prop="emergencyLevelText" width="100">
+            <template #default="{row}">
 						<span v-if="row.emergencyLevel === 2 || row.emergencyLevel === 3" style="color: var(--el-color-danger)">{{
-							row.emergencyLevelText
-						}}</span>
-						<span v-else style="color: var(--el-color-primary)">{{ row.emergencyLevelText }}</span>
-					</template>
-				</el-table-column>
-				<!--  sortable="custom" 办理期限排序 -->
-				<el-table-column prop="expiredTime" label="办理期限" show-overflow-tooltip width="170">
-					<template #default="{row}">
-						<span>{{ formatDate(row.expiredTime, 'YYYY-mm-dd HH:MM:SS') }}</span>
-					</template>
-				</el-table-column>
-				<el-table-column prop="employeeName" label="受理坐席" show-overflow-tooltip width="170">
-					<template #default="{row}">
-						<span>{{ row.employeeName + '[' + row.employeeStaffNo + ']' }}</span>
-					</template>
-				</el-table-column>
-				<el-table-column label="操作" width="150" fixed="right" align="center">
-					<!-- 草稿0 status 可以删除 -->
-					<template #default="{ row }">
-						<el-button link type="primary" @click="onOrderEdit(row)" title="编辑工单" v-if="row.status === 0" v-auth="'business:order:edit'">
-							修改
-						</el-button>
-						<el-button link type="primary" @click="onOrderDetail(row)" title="查看工单详情" v-auth="'business:order:detail'" v-else> 详情 </el-button>
-						<!-- <el-button link type="success" v-if="row.status === 0" @click="onReleaseTemp(row)" title="发布">
-								发布
-							</el-button>
-							<el-button link type="warning" v-if="row.status === 2" @click="tempEnable(row)" title="启用">
-								启用
-							</el-button>-->
+                row.emergencyLevelText
+              }}</span>
+              <span v-else style="color: var(--el-color-primary)">{{ row.emergencyLevelText }}</span>
+            </template>
+          </el-table-column>
+          <!--  sortable="custom" 办理期限排序 -->
+          <el-table-column prop="expiredTime" label="办理期限" show-overflow-tooltip width="170">
+            <template #default="{row}">
+              <span>{{ formatDate(row.expiredTime, 'YYYY-mm-dd HH:MM:SS') }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="employeeName" label="受理坐席" show-overflow-tooltip width="170">
+            <template #default="{row}">
+              <span>{{ row.employeeName + '[' + row.employeeStaffNo + ']' }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" width="150" fixed="right" align="center">
+            <!-- 草稿0 status 可以删除 -->
+            <template #default="{ row }">
+              <el-button link type="primary" @click="onOrderEdit(row)" title="编辑工单" v-if="row.status === 0" v-auth="'business:order:edit'">
+                修改
+              </el-button>
+              <el-button link type="primary" @click="onOrderDetail(row)" title="查看工单详情" v-auth="'business:order:detail'" v-else> 详情 </el-button>
+              <!-- <el-button link type="success" v-if="row.status === 0" @click="onReleaseTemp(row)" title="发布">
+                  发布
+                </el-button>
+                <el-button link type="warning" v-if="row.status === 2" @click="tempEnable(row)" title="启用">
+                  启用
+                </el-button>-->
 
-						<el-button link v-if="row.status === 0" type="danger" @click="onDeleteOrder(row)" title="删除工单" v-auth="'business:order:delete'">
-							删除
-						</el-button>
-					</template>
-				</el-table-column>
-				<template #empty>
-					<Empty />
-				</template>
-			</el-table>
-			<!-- 分页 -->
-			<pagination
-				:total="state.total"
-				v-model:page="state.queryParams.PageIndex"
-				v-model:limit="state.queryParams.PageSize"
-				@pagination="queryList"
-			/>
-			<!-- </el-tabs> -->
+              <el-button link v-if="row.status === 0" type="danger" @click="onDeleteOrder(row)" title="删除工单" v-auth="'business:order:delete'">
+                删除
+              </el-button>
+            </template>
+          </el-table-column>
+          <template #empty>
+            <Empty />
+          </template>
+        </el-table>
+        <!-- 分页 -->
+        <pagination
+            :total="state.total"
+            v-model:page="state.queryParams.PageIndex"
+            v-model:limit="state.queryParams.PageSize"
+            @pagination="queryList"
+        />
+      </div>
 		</div>
 		<!-- 工单详情 -->
 		<order-detail ref="OrderDetailRef" @updateList="queryList" />
@@ -427,7 +430,7 @@ const getBaseData = async () => {
 	state.orderStatusOptions = res.result?.orderStatusOptions ?? [];
 };
 /** 获取列表 */
-const queryList = throttle(() => {
+const queryList = () => {
 	if (!auth('business:order:query')) ElMessage.error('抱歉，您没有权限查看工单列表！');
 	else {
 		let request = other.deepClone(state.queryParams);
@@ -520,7 +523,7 @@ const queryList = throttle(() => {
 				break;
 		}
 	}
-}, 500);
+};
 // 表格排序
 const sortChange = (column: any) => {
 	console.log(column);
@@ -536,9 +539,10 @@ const resetQuery = throttle((formEl: FormInstance | undefined) => {
 	queryList();
 }, 500);
 // 切换tab 查询列表
-// const handleClick = (val: string) => {
-// 	getList();
-// };
+const handleClick = () => {
+  console.log('1')
+	queryList();
+};
 // 新增工单
 const onAddWorkOrder = () => {
 	// 跳转到录入工单页面
@@ -590,8 +594,13 @@ onMounted(() => {
 	.arrow.is-reverse {
 		transform: rotateZ(-180deg);
 	}
-	.el-table {
-		flex: 1;
-	}
+  .flex-column {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    .el-table {
+      flex: 1;
+    }
+  }
 }
 </style>

src/views/knowledge/component/Knowledge-process-record.vue

@@ -2,7 +2,7 @@
 	<div class="knowledge-Process-record-container">
 		<el-dialog :title="'审核记录 （' + state.title + '）'" v-model="state.isShowDialog"  width="80%" draggable>
 			<div v-loading="state.loading">
-				<TimeLine :data="state.traces" defaultExpandAll />
+				<process-time-line :data="state.traces" defaultExpandAll />
 			</div>
 			<template #footer>
 				<span class="dialog-footer">
@@ -18,7 +18,7 @@ import { reactive, defineAsyncComponent } from 'vue';
 import { workflowTraces } from '/@/api/system/workflow';
 
 // 引入组件
-const TimeLine = defineAsyncComponent(() => import('/@/components/TimeLine/index.vue'));
+const ProcessTimeLine = defineAsyncComponent(() => import('/src/components/ProcessTimeLine/index.vue'));
 
 // 定义变量内容
 const state = reactive<any>({

src/views/knowledge/component/Knowledge-process.vue

@@ -96,7 +96,7 @@ import other from '/@/utils/other';
 const Comment = defineAsyncComponent(() => import('/@/views/business/order/components/Order-comment.vue'));
 const Upload = defineAsyncComponent(() => import('/@/components/Upload/index.vue'));
 // 定义子组件向父组件传值/事件
-const emit = defineEmits(['submitProcessSuccess', 'submitProcessFailed']);
+const emit = defineEmits(['knowledgeProcessSuccess', 'knowledgeProcessFailed']);
 // 定义变量内容
 const state = reactive<any>({
 	isShowDialog: false,
@@ -291,12 +291,12 @@ const onSubmit = () => {
 									ElMessage.success('操作成功');
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessSuccess');
+									emit('knowledgeProcessSuccess');
 								})
 								.catch(() => {
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessFailed');
+									emit('knowledgeProcessFailed');
 								});
 							break;
 						case 'deleteStart': //开始删除流程
@@ -305,12 +305,12 @@ const onSubmit = () => {
 									ElMessage.success('操作成功');
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessSuccess');
+									emit('knowledgeProcessSuccess');
 								})
 								.catch(() => {
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessFailed');
+									emit('knowledgeProcessFailed');
 								});
 							break;
 						case 'recall': // 撤回流程
@@ -319,12 +319,12 @@ const onSubmit = () => {
 									ElMessage.success('操作成功');
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessSuccess');
+									emit('knowledgeProcessSuccess');
 								})
 								.catch(() => {
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessFailed');
+									emit('knowledgeProcessFailed');
 								});
 							break;
 						case 'return': // 退回流程
@@ -335,12 +335,12 @@ const onSubmit = () => {
 									ElMessage.success('操作成功');
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessSuccess');
+									emit('knowledgeProcessSuccess');
 								})
 								.catch(() => {
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessFailed');
+									emit('knowledgeProcessFailed');
 								});
 							break;
 
@@ -350,12 +350,12 @@ const onSubmit = () => {
 									ElMessage.success('操作成功');
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessSuccess');
+									emit('knowledgeProcessSuccess');
 								})
 								.catch(() => {
 									state.loading = false;
 									state.isShowDialog = false;
-									emit('submitProcessFailed');
+									emit('knowledgeProcessFailed');
 								});
 							break;
 					}

src/views/knowledge/knowledge/component/knowledge-edit.vue

@@ -137,7 +137,7 @@
 		<!-- 编写规范 -->
 		<knowledge-standard ref="KnowledgeStandardRef" />
 		<!-- 流程组件 -->
-		<knowledge-process ref="KnowledgeProcessRef" @submitProcessSuccess="submitProcessSuccess" />
+		<knowledge-process ref="KnowledgeProcessRef" @knowledgeProcessSuccess="knowledgeProcessSuccess" />
 	</div>
 </template>
 
@@ -265,7 +265,7 @@ const onSubmitReview = async (formEl: FormInstance | undefined) => {
 	});
 };
 // 流程提交成功
-const submitProcessSuccess = () => {
+const knowledgeProcessSuccess = () => {
 	// 关闭当前 tagsView
 	mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
 	router.push({

src/views/knowledge/knowledge/index.vue

@@ -274,7 +274,7 @@
 		<!-- 审核记录 -->
 		<knowledge-process-record ref="knowledgeProcessRecordRef" />
 		<!-- 流程组件 -->
-		<knowledge-process ref="knowledgeProcessRef" @submitProcessSuccess="submitProcessSuccess" />
+		<knowledge-process ref="knowledgeProcessRef" @knowledgeProcessSuccess="knowledgeProcessSuccess" />
 		<!-- 更新申请 -->
 		<knowledge-update ref="knowledgeUpdateRef" @updateList="queryList" />
 	</div>
@@ -559,7 +559,7 @@ const onRenew = (row: any) => {
 	knowledgeUpdateRef.value.openDialog(row, state.orgData, state.knowledgeOptions);
 };
 // 申请流程成功
-const submitProcessSuccess = () => {
+const knowledgeProcessSuccess = () => {
 	handleQuery();
 };
 // 下架

src/views/knowledge/process/index.vue

@@ -107,7 +107,7 @@
 		<!-- 审核记录 -->
 		<knowledge-process-record ref="knowledgeProcessRecordRef" />
 		<!-- 流程组件 -->
-		<knowledge-process ref="knowledgeProcessRef" @submitProcessSuccess="submitProcessSuccess" />
+		<knowledge-process ref="knowledgeProcessRef" @knowledgeProcessSuccess="knowledgeProcessSuccess" />
 	</div>
 </template>
 
@@ -185,7 +185,7 @@ const onProcess = (row: any) => {
   knowledgeProcessRef.value.openDialog({ id: row.workflowId, title: '提交', processType: 'next', commonEnum: commonEnum.KnowledgeLocution });
 };
 // 发起更新成功
-const submitProcessSuccess = () => {
+const knowledgeProcessSuccess = () => {
 	queryList();
 };
 // 查看审核记录

src/views/tels/restApply/components/Process-record.vue

@@ -2,7 +2,7 @@
 	<div class="tels-restApply-precess-record">
 		<el-dialog :title="`审核记录 （${state.title}）`" v-model="state.isShowDialog" width="80%" draggable>
 			<div v-loading="state.loading">
-				<time-line :data="state.traces" defaultExpandAll />
+				<process-time-line :data="state.traces" defaultExpandAll />
 			</div>
 			<template #footer>
 				<span class="dialog-footer">
@@ -18,7 +18,7 @@ import { reactive, defineAsyncComponent } from 'vue';
 import { workflowTraces } from '/@/api/system/workflow';
 
 // 引入组件
-const TimeLine = defineAsyncComponent(() => import('/@/components/TimeLine/index.vue'));
+const ProcessTimeLine = defineAsyncComponent(() => import('/src/components/ProcessTimeLine/index.vue'));
 
 // 定义变量内容
 const state = reactive<any>({

src/views/tels/restApply/index.vue

@@ -15,7 +15,7 @@
 						end-placeholder="结束时间"
 						value-format="YYYY-MM-DD[T]HH:mm:ss"
 						@change="
-							(val) => {
+							(val: any[]) => {
 								state.queryParams.BeginTime = val[0];
 								state.queryParams.EndTime = val[1];
 							}
@@ -108,7 +108,7 @@
 		</el-card>
 
 		<!-- 处理流程 -->
-		<process ref="processRef" @submitProcessSuccess="queryList" @submitProcessFailed="queryList" />
+		<process ref="processRef" @orderProcessSuccess="queryList" @orderProcessFailed="queryList" />
 		<!-- 流转记录 -->
 		<process-record ref="ProcessRecordRef" />
 	</div>