feat:工单撤销，工单补充，工单督办页面新增;

package.json

@@ -7,7 +7,7 @@
 	"scripts": {
 		"dev": "vite --force",
 		"build": "vite build",
-		"test": "vite build --mode test",
+		"build:test": "vite build --mode test",
 		"preview": "vite preview",
 		"serve": "http-server ./dist",
 		"lint-fix": "eslint --fix --ext .js --ext .jsx --ext .vue src/"

src/utils/request.ts

@@ -45,7 +45,6 @@ export default function myAxios(axiosConfig: any, customOptions?: any, loadingOp
 			if (config.baseURL === import.meta.env.VITE_WEX_API_URL) { // 维尔信登录
 				if (!Session.get('wexToken')) {
 					const res = await axios.post(import.meta.env.VITE_WEX_API_URL + '/login/token', {username: import.meta.env.VITE_WEX_DEFAULT_ACCOUNT, password: import.meta.env.VITE_WEX_DEFAULT_PASSWORD});
-						console.log(res)
 						if (res.data.code === 200) {
 							Session.set('wexToken', res.data.data.token);
 						}else{

src/views/business/delay/component/index.vue

@@ -1,11 +0,0 @@
-<script setup lang="ts">
-
-</script>
-
-<template>
-
-</template>
-
-<style scoped lang="scss">
-
-</style>

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

@@ -0,0 +1,153 @@
+<template>
+  <el-dialog v-model="state.isShowDialog" draggable title="延期申请" ref="dialogRef" width="80%" append-to-body destroy-on-close>
+        <div class="collapse-container pb1">
+          <el-form label-width="110px" ref="ruleFormRef">
+            <el-row :gutter="35">
+              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+                <el-form-item label="工单编号"> {{ state.ruleForm.no }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+                <el-form-item label="工单标题"> {{ state.ruleForm.title }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+                <el-form-item label="申请人"> {{ state.ruleForm.title }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+                <el-form-item label="申请部门"> {{ state.ruleForm.title }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+                <el-form-item label="申请时间"> {{ state.ruleForm.title }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+                <el-form-item label="当前期满时间"> {{ state.ruleForm.title }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+                <el-row :gutter="10">
+                    <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
+                      <el-form-item label="延期申请数量" prop="handleResult" :rules="[{ required: true, message: '请输入延期申请数量', trigger: 'blur' }]">
+                        <el-input placeholder="请输入延期申请数量" v-model="state.ruleForm.handleResult"></el-input>
+                      </el-form-item>
+                    </el-col>
+                  <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
+                    <el-form-item label="" label-width="0" prop="title" :rules="[{ required: true, message: '请选择延期申请单位', trigger: 'change' }]">
+                      <el-select v-model="state.ruleForm.title" placeholder="请选择延期申请单位" 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>
+                </el-row>
+                <el-form-item label="当前期满时间"> {{ state.ruleForm.title }} </el-form-item>
+              </el-col>
+              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+                <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="申请理由" prop="handleResult" :rules="[{ required: true, message: '请填写申请理由', trigger: 'blur' }]">
+                  <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="handleResult" :rules="[{ required: false, message: '请填写申请理由', trigger: 'blur' }]">
+                  <annex-list />
+                </el-form-item>
+              </el-col>
+
+            </el-row>
+          </el-form>
+        </div>
+    <template #footer>
+			<span class="dialog-footer">
+        <el-button @click="onCancel" class="default-button">取 消</el-button>
+				<el-button type="primary" @click="onSubmit(ruleFormRef)" :loading="state.loading" v-auth="'business:order:delay'">提交</el-button>
+			</span>
+    </template>
+  </el-dialog>
+</template>
+<script setup lang="ts" name="orderDelayDialog">
+import {defineAsyncComponent, reactive, ref} from 'vue';
+import {ElMessageBox, FormInstance} from 'element-plus';
+import { VoiceInterfaceObject } from '/@/utils/PhoneScript';
+
+// 引入组件
+const AnnexList = defineAsyncComponent(() => import('/@/components/AnnexList/index.vue'));
+
+// 定义子组件向父组件传值/事件
+const emit = defineEmits(['updateList']);
+// 定义变量内容
+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',
+      },
+    ]
+  },
+});
+const ruleFormRef = ref<RefType>();
+// 打开弹窗
+const openDialog = () => {
+  state.loading = false;
+  state.isShowDialog = true;
+};
+// 关闭弹窗
+const closeDialog = () => {
+  state.isShowDialog = false;
+  state.ruleForm = {};
+};
+// 取消
+const onCancel = () => {
+  closeDialog();
+};
+// 呼叫
+const onCall = ()=>{
+  // 呼叫外部电话
+  VoiceInterfaceObject.DialOut(state.ruleForm.fromPhone);
+}
+// 提交
+const onSubmit = (formEl: FormInstance | undefined) => {
+  if (!formEl) return;
+  ElMessageBox.confirm('您确定要提交吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning',
+  })
+      .then(() => {
+        state.loading = true;
+        setTimeout(() => {
+          state.loading = false;
+          state.isShowDialog = false;
+          emit('updateList');
+        }, 1000);
+      })
+      .catch(() => {
+        // 取消
+      });
+};
+defineExpose({
+  openDialog,
+  closeDialog,
+});
+</script>
+
+<style lang="scss" scoped>
+.collapse-box {
+
+}
+</style>

src/views/business/delay/index.vue

@@ -186,6 +186,8 @@
     </el-card>
     <!-- 工单详情 -->
     <order-detail ref="OrderDetailRef" @updateList="queryList" />
+    <!--  工单延期  -->
+    <order-delay ref="OrderDelayRef" @updateList="queryList" />
   </div>
 </template>
 <script setup lang="ts" name="orderDelay">
@@ -198,6 +200,7 @@ import { formatDate } from '/@/utils/formatTime';
 import {useRouter} from "vue-router";
 // 引入组件
 const OrderDetail = defineAsyncComponent(() => import('/@/views/business/order/components/Order-detail.vue'));
+const OrderDelay = defineAsyncComponent(() => import('/src/views/business/delay/components/Order-delay.vue'));
 
 // 定义变量内容
 const ruleFormRef = ref<RefType>(); // 表单ref
@@ -305,9 +308,11 @@ const resetQuery = throttle((formEl: FormInstance | undefined) => {
 const onExport = () => {
   console.log('导出');
 };
+const OrderDelayRef = ref<RefType>();
 // 查看延期详情
 const onOrderDetail = (row: any) => {
   console.log(row,'查看延期详情')
+  OrderDelayRef.value.openDialog()
 };
 // 流程明细
 const processDetail = ()=>{

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

@@ -1,6 +1,5 @@
 <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">

src/views/business/followUp/index.vue

@@ -180,7 +180,6 @@ import { formatDate } from '/@/utils/formatTime';
 import {useRouter} from "vue-router";
 // 引入组件
 const FollowUpPhone = defineAsyncComponent(() => import('/@/views/business/followUp/component/Follow-up-phone.vue'));
-// 引入组件
 const OrderDetail = defineAsyncComponent(() => import('/@/views/business/order/components/Order-detail.vue'));
 
 // 定义变量内容

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

@@ -7,34 +7,35 @@
 					<!-- <div class="flex-center-between mb20">
 						<p class="table-title">工单信息</p>
 					</div> -->
-					<el-form :model="state.ruleForm" ref="ruleFormRef" label-width="110px" label-position="right"
-						scroll-to-error v-loading="state.formLoading">
+					<el-form :model="state.ruleForm" ref="ruleFormRef" label-width="110px" label-position="right" scroll-to-error v-loading="state.formLoading">
 						<p class="border-title mb10">来电信息</p>
 						<el-row :gutter="0">
 							<!-- 来源渠道 -->
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
 								<!-- 手动创建 -->
 								<template v-if="state.createBy === 'manual'">
-									<el-form-item label="来源渠道" prop="channel"
-										:rules="[{ required: true, message: '请选择来源渠道', trigger: 'change' }]">
-										<el-select v-model="state.ruleForm.channel" placeholder="请选择来源渠道" class="w100"
-											clearable @change="() => {
-												ruleFormRef.resetFields('fromPhone');
-												state.ruleForm.fromPhone = '';
-											}
-												">
-											<el-option v-for="item in state.channelOptions" :key="item.key"
-												:label="item.value" :value="item.key" />
+									<el-form-item label="来源渠道" prop="channel" :rules="[{ required: true, message: '请选择来源渠道', trigger: 'change' }]">
+										<el-select
+											v-model="state.ruleForm.channel"
+											placeholder="请选择来源渠道"
+											class="w100"
+											clearable
+											@change="
+												() => {
+													ruleFormRef.resetFields('fromPhone');
+													state.ruleForm.fromPhone = '';
+												}
+											"
+										>
+											<el-option v-for="item in state.channelOptions" :key="item.key" :label="item.value" :value="item.key" />
 										</el-select>
 									</el-form-item>
 								</template>
 								<!-- 来电弹单 -->
 								<template v-if="state.createBy === 'tel'">
 									<el-form-item label="来源渠道" prop="channel">
-										<el-select v-model="state.ruleForm.channel" placeholder="请选择来源渠道" class="w100"
-											disabled>
-											<el-option v-for="item in state.channelOptions" :key="item.key"
-												:label="item.value" :value="item.key" />
+										<el-select v-model="state.ruleForm.channel" placeholder="请选择来源渠道" class="w100" disabled>
+											<el-option v-for="item in state.channelOptions" :key="item.key" :label="item.value" :value="item.key" />
 										</el-select>
 									</el-form-item>
 								</template>
@@ -69,23 +70,25 @@
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="state.ruleForm.channel === 0">
 								<!-- 手动创建 -->
 								<template v-if="state.createBy === 'manual'">
-									<el-form-item label="来电号码" prop="fromPhone" :rules="[
-										{ required: true, message: '请填写来电号码', trigger: 'blur' },
-										{
-											pattern: /^((0\d{2,3}(-)?\d{7,8})|(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8})$/,
-											message: '来电号码格式错误',
-											trigger: 'blur',
-										},
-									]">
-										<el-input v-model="state.ruleForm.fromPhone" placeholder="请填写来电号码" clearable
-											@blur="searchHistory"> </el-input>
+									<el-form-item
+										label="来电号码"
+										prop="fromPhone"
+										:rules="[
+											{ required: true, message: '请填写来电号码', trigger: 'blur' },
+											{
+												pattern: /^((0\d{2,3}(-)?\d{7,8})|(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8})$/,
+												message: '来电号码格式错误',
+												trigger: 'blur',
+											},
+										]"
+									>
+										<el-input v-model="state.ruleForm.fromPhone" placeholder="请填写来电号码" clearable @blur="searchHistory"> </el-input>
 									</el-form-item>
 								</template>
 								<!-- 来电弹单 -->
 								<template v-if="state.createBy === 'tel'">
 									<el-form-item label="来电号码" prop="fromPhone">
-										<el-input v-model="state.ruleForm.fromPhone" placeholder="请填写来电号码" disabled>
-										</el-input>
+										<el-input v-model="state.ruleForm.fromPhone" placeholder="请填写来电号码" disabled> </el-input>
 									</el-form-item>
 								</template>
 								<!-- 互联网来信 -->
@@ -100,8 +103,7 @@
 								<el-form-item label="服务坐席">
 									<!-- 手动创建 -->
 									<template v-if="state.createBy === 'manual'">
-										<span>{{ state.ruleForm.employeeName + '[' + state.ruleForm.employeeStaffNo + ']'
-										}}</span>
+										<span>{{ state.ruleForm.employeeName + '[' + state.ruleForm.employeeStaffNo + ']' }}</span>
 									</template>
 									<!-- 来电弹单 -->
 									<template v-if="state.createBy === 'tel'">
@@ -114,95 +116,112 @@
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-								<el-form-item label="来电/信人" prop="fromName"
-									:rules="[{ required: true, message: '请填写来电/信人', trigger: 'blur' }]">
-									<el-input v-model="state.ruleForm.fromName" placeholder="请填写来电/信人" clearable>
-									</el-input>
+								<el-form-item label="来电/信人" prop="fromName" :rules="[{ required: true, message: '请填写来电/信人', trigger: 'blur' }]">
+									<el-input v-model="state.ruleForm.fromName" placeholder="请填写来电/信人" clearable> </el-input>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-								<el-form-item label="来电/信人性别" prop="fromGender"
-									:rules="[{ required: true, message: '请选择来电/信人性别', trigger: 'change' }]">
+								<el-form-item
+									label="来电/信人性别"
+									prop="fromGender"
+									:rules="[{ required: true, message: '请选择来电/信人性别', trigger: 'change' }]"
+								>
 									<el-radio-group v-model="state.ruleForm.fromGender">
-										<el-radio :label="item.key" v-for="item in state.genderOptions" :key="item.key">{{
-											item.value }}</el-radio>
+										<el-radio :label="item.key" v-for="item in state.genderOptions" :key="item.key">{{ item.value }}</el-radio>
 									</el-radio-group>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-								<el-form-item label="来电/信人身份" prop="identityType"
-									:rules="[{ required: true, message: '请选择来电/信人身份', trigger: 'change' }]">
+								<el-form-item
+									label="来电/信人身份"
+									prop="identityType"
+									:rules="[{ required: true, message: '请选择来电/信人身份', trigger: 'change' }]"
+								>
 									<el-radio-group v-model="state.ruleForm.identityType" @change="selectIdentity">
-										<el-radio :label="item.key" v-for="item in state.identityTypeOptions"
-											:key="item.key">{{ item.value }}</el-radio>
+										<el-radio :label="item.key" v-for="item in state.identityTypeOptions" :key="item.key">{{ item.value }}</el-radio>
 									</el-radio-group>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-								<el-form-item label="证件类型" prop="licenceTypeObj"
-									:rules="[{ required: false, message: '请选择证件类型', trigger: 'change' }]">
-									<el-select v-model="state.ruleForm.licenceTypeObj" placeholder="请选择证件类型" class="w100"
-										clearable value-key="dicDataValue" @change="(val:any) => {
+								<el-form-item label="证件类型" prop="licenceTypeObj" :rules="[{ required: false, message: '请选择证件类型', trigger: 'change' }]">
+									<el-select
+										v-model="state.ruleForm.licenceTypeObj"
+										placeholder="请选择证件类型"
+										class="w100"
+										clearable
+										value-key="dicDataValue"
+										@change="(val:any) => {
 											state.ruleForm.licenceType = val.dicDataName;
 											state.ruleForm.licenceTypeCode = val.dicDataValue
-										}">
-										<el-option v-for="item in state.licenceTypeOptions" :key="item.dicDataValue"
-											:label="item.dicDataName" :value="item" />
+										}"
+									>
+										<el-option v-for="item in state.licenceTypeOptions" :key="item.dicDataValue" :label="item.dicDataName" :value="item" />
 									</el-select>
 								</el-form-item>
 							</el-col>
 							<!-- 若“证件类型”有值，则证件号码必填 -->
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-								<el-form-item label="证件号码" prop="licenceNo" :rules="[
-									{ required: state.ruleForm.licenceTypeCode, message: '请填写证件号码', trigger: 'blur' },
-									{
-										pattern: licenceNoPattern,
-										message: '证件号码格式错误',
-										trigger: 'blur',
-									},
-								]">
-									<el-input v-model="state.ruleForm.licenceNo" placeholder="请填写证件号码" clearable>
-									</el-input>
+								<el-form-item
+									label="证件号码"
+									prop="licenceNo"
+									:rules="[
+										{ required: state.ruleForm.licenceTypeCode, message: '请填写证件号码', trigger: 'blur' },
+										{
+											pattern: licenceNoPattern,
+											message: '证件号码格式错误',
+											trigger: 'blur',
+										},
+									]"
+								>
+									<el-input v-model="state.ruleForm.licenceNo" placeholder="请填写证件号码" clearable> </el-input>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-								<el-form-item label="年龄段" prop="ageRangeObj"
-									:rules="[{ required: false, message: '请选择年龄段', trigger: 'change' }]">
-									<el-select v-model="state.ruleForm.ageRangeObj" placeholder="请选择年龄段" class="w100"
-										clearable value-key="dicDataValue" @change="(val:any) => {
+								<el-form-item label="年龄段" prop="ageRangeObj" :rules="[{ required: false, message: '请选择年龄段', trigger: 'change' }]">
+									<el-select
+										v-model="state.ruleForm.ageRangeObj"
+										placeholder="请选择年龄段"
+										class="w100"
+										clearable
+										value-key="dicDataValue"
+										@change="(val:any) => {
 											state.ruleForm.ageRange = val.dicDataName;
 											state.ruleForm.ageRangeCode = val.dicDataValue
-										}">
-										<el-option v-for="item in state.ageRangeOptions" :key="item.dicDataValue"
-											:label="item.dicDataName" :value="item" />
+										}"
+									>
+										<el-option v-for="item in state.ageRangeOptions" :key="item.dicDataValue" :label="item.dicDataName" :value="item" />
 									</el-select>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-								<el-form-item label="联系电话" prop="contact" :rules="[
-									{ required: true, message: '请填写联系电话', trigger: 'blur' },
-									{
-										pattern: /^((0\d{2,3}(-)?\d{7,8})|(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8})$/,
-										message: '联系电话格式错误',
-										trigger: 'blur',
-									},
-								]">
-									<el-input v-model="state.ruleForm.contact"
-										placeholder="请填写联系电话" clearable>
-									</el-input>
+								<el-form-item
+									label="联系电话"
+									prop="contact"
+									:rules="[
+										{ required: true, message: '请填写联系电话', trigger: 'blur' },
+										{
+											pattern: /^((0\d{2,3}(-)?\d{7,8})|(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8})$/,
+											message: '联系电话格式错误',
+											trigger: 'blur',
+										},
+									]"
+								>
+									<el-input v-model="state.ruleForm.contact" placeholder="请填写联系电话" clearable> </el-input>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-								<el-form-item label="" prop="acceptSms"
-									:rules="[{ required: false, message: '请选择', trigger: 'change' }]">
+								<el-form-item label="" prop="acceptSms" :rules="[{ required: false, message: '请选择', trigger: 'change' }]">
 									<el-checkbox v-model="state.ruleForm.acceptSms" label="受理短信" />
-                  <el-checkbox v-model="state.ruleForm.isSecret" label="是否保密" />
+									<el-checkbox v-model="state.ruleForm.isSecret" label="是否保密" />
 								</el-form-item>
 							</el-col>
 							<!-- 当“来电/信人身份”为“企业”时必填 -->
 							<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
-								<el-form-item label="工作单位" prop="company"
-									:rules="[{ required: state.ruleForm.identityType === 2, message: '请填写工作单位', trigger: 'blur' }]">
+								<el-form-item
+									label="工作单位"
+									prop="company"
+									:rules="[{ required: state.ruleForm.identityType === 2, message: '请填写工作单位', trigger: 'blur' }]"
+								>
 									<el-input v-model="state.ruleForm.company" placeholder="请填写工作单位" clearable> </el-input>
 								</el-form-item>
 							</el-col>
@@ -213,77 +232,91 @@
 								<el-form-item label="工单编码"> {{ state.ruleForm.no }} </el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
-								<el-form-item label="工单标题" prop="title"
-									:rules="[{ required: true, message: '请填写工单标题', trigger: 'blur' }]">
+								<el-form-item label="工单标题" prop="title" :rules="[{ required: true, message: '请填写工单标题', trigger: 'blur' }]">
 									<el-input v-model="state.ruleForm.title" placeholder="请填写工单标题" clearable> </el-input>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
 								<el-row :gutter="0">
 									<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-										<el-form-item label="工单类型" prop="orderType"
-											:rules="[{ required: true, message: '请选择工单类型', trigger: 'change' }]">
-											<el-select v-model="state.ruleForm.orderType" placeholder="请选择工单类型" class="w100"
-												@change="selectOrderType">
-												<el-option v-for="item in state.orderTypeOptions" :key="item.key"
-													:label="item.value" :value="item.key" />
+										<el-form-item label="工单类型" prop="orderType" :rules="[{ required: true, message: '请选择工单类型', trigger: 'change' }]">
+											<el-select v-model="state.ruleForm.orderType" placeholder="请选择工单类型" class="w100" @change="selectOrderType">
+												<el-option v-for="item in state.orderTypeOptions" :key="item.key" :label="item.value" :value="item.key" />
 											</el-select>
 										</el-form-item>
 									</el-col>
 									<!-- 当“工单类型”为非通用工单时，展示【拓展信息】按钮 -->
-									<el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6" :offset="1"
-										v-if="state.ruleForm.orderType === 1 && state.ruleForm.acceptType">
+									<el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6" :offset="1" v-if="state.ruleForm.orderType === 1 && state.ruleForm.acceptType">
 										<el-form-item label="" label-width="0px">
-											<el-button @click="showExpandForm">
-												<SvgIcon name="ele-CirclePlus" class="mr3" size="16px" /> 拓展信息
-											</el-button>
+											<el-button @click="showExpandForm"> <SvgIcon name="ele-CirclePlus" class="mr3" size="16px" /> 拓展信息 </el-button>
 										</el-form-item>
 									</el-col>
 								</el-row>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-								<el-form-item label="受理类型" prop="acceptType"
-									:rules="[{ required: true, message: '请选择受理类型', trigger: 'change' }]">
+								<el-form-item label="受理类型" prop="acceptType" :rules="[{ required: true, message: '请选择受理类型', trigger: 'change' }]">
 									<el-select v-model="state.ruleForm.acceptType" placeholder="请选择受理类型" class="w100">
-										<el-option v-for="item in state.acceptTypeOptions" :key="item.key"
-											:disabled="item.disabled" :label="item.value" :value="item.key" />
+										<el-option
+											v-for="item in state.acceptTypeOptions"
+											:key="item.key"
+											:disabled="item.disabled"
+											:label="item.value"
+											:value="item.key"
+										/>
 									</el-select>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-								<el-form-item label="紧急程度" prop="emergencyLevel"
-									:rules="[{ required: true, message: '请选择紧急程度', trigger: 'change' }]">
+								<el-form-item label="紧急程度" prop="emergencyLevel" :rules="[{ required: true, message: '请选择紧急程度', trigger: 'change' }]">
 									<el-select v-model="state.ruleForm.emergencyLevel" placeholder="请选择紧急程度" class="w100">
-										<el-option v-for="item in state.emergencyLevelOptions" :key="item.key"
-											:label="item.value" :value="item.key" />
+										<el-option v-for="item in state.emergencyLevelOptions" :key="item.key" :label="item.value" :value="item.key" />
 									</el-select>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
-								<el-form-item label="热点分类" prop="hotspotId"
-									:rules="[{ required: true, message: '请选择热点分类', trigger: 'change' }]">
-									<el-tree-select class="w100" v-model="state.ruleForm.hotspotId" filterable
-										placeholder="请选择热点分类" :props="HotspotProps" lazy :load="load" node-key="id"
-										check-strictly :render-after-expand="false" @node-click="hotSpotChange"
-										ref="hotspotRef" :default-expanded-keys="state.hotspotExternal" />
+								<el-form-item label="热点分类" prop="hotspotId" :rules="[{ required: true, message: '请选择热点分类', trigger: 'change' }]">
+									<el-tree-select
+										class="w100"
+										v-model="state.ruleForm.hotspotId"
+										filterable
+										placeholder="请选择热点分类"
+										:props="HotspotProps"
+										lazy
+										:load="load"
+										node-key="id"
+										check-strictly
+										:render-after-expand="false"
+										@node-click="hotSpotChange"
+										ref="hotspotRef"
+										:default-expanded-keys="state.hotspotExternal"
+									/>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-								<el-form-item label="事发时间" prop="incidentTime"
-									:rules="[{ required: false, message: '请选择事发时间', trigger: 'change' }]">
-									<el-date-picker v-model="state.ruleForm.incidentTime" type="datetime"
-										placeholder="请选择事发时间" value-format="YYYY-MM-DD[T]HH:mm:ss" class="w100" />
+								<el-form-item label="事发时间" prop="incidentTime" :rules="[{ required: false, message: '请选择事发时间', trigger: 'change' }]">
+									<el-date-picker
+										v-model="state.ruleForm.incidentTime"
+										type="datetime"
+										placeholder="请选择事发时间"
+										value-format="YYYY-MM-DD[T]HH:mm:ss"
+										class="w100"
+									/>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
 								<el-row :gutter="0">
 									<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-										<el-form-item label="事发地址" prop="areaCode"
-											:rules="[{ required: false, message: '请选择事发地址', trigger: 'change' }]">
-											<el-cascader :options="state.areaOptions" filterable
+										<el-form-item label="事发地址" prop="areaCode" :rules="[{ required: false, message: '请选择事发地址', trigger: 'change' }]">
+											<el-cascader
+												:options="state.areaOptions"
+												filterable
 												:props="{ value: 'id', label: 'areaName', emitPath: false }"
-												placeholder="请选择事发地址" class="w100" v-model="state.ruleForm.areaCode"
-												ref="areaRef" @change="changeArea">
+												placeholder="请选择事发地址"
+												class="w100"
+												v-model="state.ruleForm.areaCode"
+												ref="areaRef"
+												@change="changeArea"
+											>
 												<template #default="{ node, data }">
 													<span>{{ data.areaName }}</span>
 													<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
@@ -292,11 +325,13 @@
 										</el-form-item>
 									</el-col>
 									<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-										<el-form-item label="" prop="street"
+										<el-form-item
+											label=""
+											prop="street"
 											:rules="[{ required: false, message: '请填写详细地址', trigger: 'blur' }]"
-											label-width="10px">
-											<el-input v-model="state.ruleForm.street" placeholder="请填写详细地址" clearable>
-											</el-input>
+											label-width="10px"
+										>
+											<el-input v-model="state.ruleForm.street" placeholder="请填写详细地址" clearable> </el-input>
 										</el-form-item>
 									</el-col>
 								</el-row>
@@ -305,24 +340,23 @@
 							<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
 								<el-row :gutter="0">
 									<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-										<el-form-item label="是否重复" prop="isRepeat"
-											:rules="[{ required: true, message: '请选择是否重复', trigger: 'change' }]">
-											<el-select v-model="state.ruleForm.isRepeat" placeholder="请选择是否重复" class="w100"
-												@change="isRepeatChange">
-												<el-option v-for="item in state.repeatOptions" :key="item.key"
-													:label="item.value" :value="item.key" />
+										<el-form-item label="是否重复" prop="isRepeat" :rules="[{ required: true, message: '请选择是否重复', trigger: 'change' }]">
+											<el-select v-model="state.ruleForm.isRepeat" placeholder="请选择是否重复" class="w100" @change="isRepeatChange">
+												<el-option v-for="item in state.repeatOptions" :key="item.key" :label="item.value" :value="item.key" />
 											</el-select>
 										</el-form-item>
 									</el-col>
 									<!-- 必填，若“是否重复”为“是”，则展示重复件选择框 -->
-									<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12"
-										v-if="state.ruleForm.isRepeat === 'true'">
-										<el-form-item label="" prop="duplicateTitle" label-width="10px"
-											:rules="[{ required: true, message: '请选择重复件', trigger: 'change' }]">
+									<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="state.ruleForm.isRepeat === 'true'">
+										<el-form-item
+											label=""
+											prop="duplicateTitle"
+											label-width="10px"
+											:rules="[{ required: true, message: '请选择重复件', trigger: 'change' }]"
+										>
 											<el-input v-model="state.ruleForm.duplicateTitle" placeholder="请选择重复件" readonly>
 												<template #suffix>
-													<el-button link type="danger" v-if="state.ruleForm.duplicateTitle"
-														@click="clearRepeat">
+													<el-button link type="danger" v-if="state.ruleForm.duplicateTitle" @click="clearRepeat">
 														<SvgIcon name="ele-Delete" size="16px" />
 													</el-button>
 													<el-button link type="primary" class="ml1" @click="selectRepeat">
@@ -335,38 +369,43 @@
 								</el-row>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-								<el-form-item label="推送分类" prop="pushTypeObj"
-									:rules="[{ required: false, message: '请选择推送分类', trigger: 'change' }]">
-									<el-select v-model="state.ruleForm.pushTypeObj" placeholder="请选择推送分类" class="w100"
-										clearable value-key="dicDataValue" @change="(val:any) => {
+								<el-form-item label="推送分类" prop="pushTypeObj" :rules="[{ required: false, message: '请选择推送分类', trigger: 'change' }]">
+									<el-select
+										v-model="state.ruleForm.pushTypeObj"
+										placeholder="请选择推送分类"
+										class="w100"
+										clearable
+										value-key="dicDataValue"
+										@change="(val:any) => {
 											state.ruleForm.pushType = val.dicDataName;
 											state.ruleForm.pushTypeCode = val.dicDataValue
-										}">
-										<el-option v-for="item in state.pushTypeOptions" :key="item.dicDataValue"
-											:label="item.dicDataName" :value="item" />
+										}"
+									>
+										<el-option v-for="item in state.pushTypeOptions" :key="item.dicDataValue" :label="item.dicDataName" :value="item" />
 									</el-select>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
-								<el-form-item label="诉求详情" prop="content"
-									:rules="[{ required: true, message: '请填写诉求详情', trigger: 'blur' }]">
-									<Comment @chooseComment="chooseComment" v-model="state.ruleForm.content"
-										placeholder="请填写诉求详情" :loading="state.formLoading" :commonEnum="commonEnum.Seat"
-										modal />
+								<el-form-item label="诉求详情" prop="content" :rules="[{ required: true, message: '请填写诉求详情', trigger: 'blur' }]">
+									<Comment
+										@chooseComment="chooseComment"
+										v-model="state.ruleForm.content"
+										placeholder="请填写诉求详情"
+										:loading="state.formLoading"
+										:commonEnum="commonEnum.Seat"
+										modal
+									/>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
-								<el-form-item label="附件" prop="remark"
-									:rules="[{ required: false, message: '请填写诉求内容', trigger: 'change' }]">
-                  <annex-list ref="AnnexListRef"></annex-list>
+								<el-form-item label="附件" prop="remark" :rules="[{ required: false, message: '请填写诉求内容', trigger: 'change' }]">
+									<annex-list ref="AnnexListRef"></annex-list>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="12" :md="24" :lg="24" :xl="24">
 								<el-form-item>
-									<el-button class="default-button" @click="save" v-auth="'business:order:add'"> 保存
-									</el-button>
-									<el-button type="primary" v-waves @click="submit"
-										v-auth="'business:order:startWorkflow'"> 提交 </el-button>
+									<el-button class="default-button" @click="save(ruleFormRef)" v-auth="'business:order:add'"> 保存 </el-button>
+									<el-button type="primary" v-waves @click="submit(ruleFormRef)" v-auth="'business:order:startWorkflow'"> 提交 </el-button>
 								</el-form-item>
 							</el-col>
 						</el-row>
@@ -383,22 +422,26 @@
 						</el-tabs> -->
 						<el-form :model="state.queryParams" ref="queryParamsRef" :inline="true" @submit.native.prevent>
 							<el-form-item label="关键词" prop="Keyword">
-								<el-input v-model="state.queryParams.Keyword" placeholder="工单标题/工单编码" clearable
-									@keyup.enter="handleQuery" />
+								<el-input v-model="state.queryParams.Keyword" placeholder="工单标题/工单编码" clearable @keyup.enter="handleQuery" />
 							</el-form-item>
 							<el-form-item>
 								<el-button type="primary" @click="handleQuery" :loading="state.historyOrderLoading">
 									<SvgIcon name="ele-Search" class="mr5" />查询
 								</el-button>
-								<el-button @click="resetQuery(queryParamsRef)" :loading="state.historyOrderLoading"
-									class="default-button">
+								<el-button @click="resetQuery(queryParamsRef)" :loading="state.historyOrderLoading" class="default-button">
 									<SvgIcon name="ele-Refresh" class="mr5" />重置
 								</el-button>
 							</el-form-item>
 						</el-form>
-						<el-table :data="state.tableData" v-loading="state.historyOrderLoading" row-key="id"
-							@selection-change="handleSelectionChange" max-height="300" ref="multipleTableRef">
-              <el-table-column type="selection" label="重复件" width="80" v-if="state.ruleForm.isRepeat === 'true'"/>
+						<el-table
+							:data="state.tableData"
+							v-loading="state.historyOrderLoading"
+							row-key="id"
+							@selection-change="handleSelectionChange"
+							max-height="300"
+							ref="multipleTableRef"
+						>
+							<el-table-column type="selection" label="重复件" width="80" v-if="state.ruleForm.isRepeat === 'true'" />
 							<el-table-column prop="phoneNo" label="工单标题" show-overflow-tooltip width="180">
 								<template #default="{ row }">
 									<span style="color: var(--el-color-primary)">{{ row.title }}</span>
@@ -410,26 +453,19 @@
 							<el-table-column prop="statusText" label="状态" width="70" fixed="right" align="center">
 								<template #default="{ row }">
 									<!-- 草稿 -->
-									<span style="color: var(--el-color-info)" v-if="row.status === 0">{{ row.statusText
-									}}</span>
+									<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-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 === 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-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-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-success)" v-if="row.status === 50">{{ row.statusText }}</span>
 									<!-- 已归档 -->
-									<span style="color: var(--el-color-info)" v-if="row.status === 60">{{ 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="statusText" label="操作" width="70" fixed="right" align="center">
@@ -439,8 +475,12 @@
 							</el-table-column>
 						</el-table>
 						<!-- 分页 -->
-						<pagination :total="state.total" v-model:page="state.queryParams.PageIndex"
-							v-model:limit="state.queryParams.PageSize" @pagination="searchHistory" />
+						<pagination
+							:total="state.total"
+							v-model:page="state.queryParams.PageIndex"
+							v-model:limit="state.queryParams.PageSize"
+							@pagination="searchHistory"
+						/>
 					</div>
 					<!-- 知识检索 -->
 					<div class="right-content-knowledge mt20 box pd20">
@@ -448,22 +488,37 @@
 							<p class="table-title">知识检索</p>
 						</div>
 						<div class="knowledge-container">
-							<el-input v-model="state.KnowledgeKeyword" class="knowledge-input mb20" placeholder="请填写搜索内容"
-								@keyup.enter="knowledgeRetrievalPaged(state.KnowledgeKeyword)">
+							<el-input
+								v-model="state.KnowledgeKeyword"
+								class="knowledge-input mb20"
+								placeholder="请填写搜索内容"
+								@keyup.enter="knowledgeRetrievalPaged(state.KnowledgeKeyword)"
+							>
 								<template #prefix>
 									<SvgIcon name="ele-Search" size="16px" />
 								</template>
 								<template #suffix>
-									<el-button class="knowledge-search-button" type="primary" :loading="state.loading" round
-										@click="knowledgeRetrievalPaged(state.KnowledgeKeyword)">
+									<el-button
+										class="knowledge-search-button"
+										type="primary"
+										:loading="state.loading"
+										round
+										@click="knowledgeRetrievalPaged(state.KnowledgeKeyword)"
+									>
 										<SvgIcon name="ele-Search" size="16px" color="#fff" />
 									</el-button>
 								</template>
 							</el-input>
 							<div>
 								<span class="mr10" v-if="state.hotWords.length">搜索热词</span>
-								<el-tag v-for="(item, index) in state.hotWords" :key="index" class="mr10 mb10"
-									style="cursor: pointer" @click="knowledgeRetrievalPaged(item)" round>
+								<el-tag
+									v-for="(item, index) in state.hotWords"
+									:key="index"
+									class="mr10 mb10"
+									style="cursor: pointer"
+									@click="knowledgeRetrievalPaged(item)"
+									round
+								>
 									{{ item }}
 								</el-tag>
 							</div>
@@ -473,8 +528,7 @@
 										<span></span>
 									</template>
 								</el-empty>
-								<li v-for="(item, index) in state.knowledgeList" :key="index" class="mb20 knowledge-item"
-									@click="onPreview(item)" v-else>
+								<li v-for="(item, index) in state.knowledgeList" :key="index" class="mb20 knowledge-item" @click="onPreview(item)" v-else>
 									<p class="font16">
 										<SvgIcon name="iconfont icon-dian" size="16px" /> <b>{{ item.title }}</b>
 									</p>
@@ -483,10 +537,15 @@
 							</ul>
 						</div>
 						<!-- 分页 -->
-						<pagination :total="state.knowledgeTotal" v-model:page="state.knowledgeQuery.PageIndex"
+						<pagination
+							:total="state.knowledgeTotal"
+							v-model:page="state.knowledgeQuery.PageIndex"
 							v-model:limit="state.knowledgeQuery.PageSize"
-							@pagination="knowledgeRetrievalPaged(state.KnowledgeKeyword)" :pageSizes="[5, 10, 15, 20]"
-							layout="total, prev, pager, next" class="pt10" />
+							@pagination="knowledgeRetrievalPaged(state.KnowledgeKeyword)"
+							:pageSizes="[5, 10, 15, 20]"
+							layout="total, prev, pager, next"
+							class="pt10"
+						/>
 					</div>
 				</el-scrollbar>
 			</el-col>
@@ -530,38 +589,38 @@ const state = reactive<any>({
 	createBy: 'manual', // 工单创建方式 默认手动创建  tel:来电弹单  letter:互联网来信 默认表示手动创建
 	activeName: 'first', // tabs
 	ruleForm: {
-    channel: '', // 来源频道
-    transferPhone: '', // 转接来源
-    fromPhone: '', // 来电号码
-    employeeName: '', // 员工姓名
-    employeeStaffNo: '', // 员工工号
-    fromName: '', // 来电人姓名
-    fromGender: 1, // 来电人性别 默认先生
-    identityType: 1, // 来电/信人身份 默认市民
-    licenceType:'', // 证件类型
-    licenceTypeCode: '', // 证件类型code
-    licenceNo: '', // 证件号码
-    ageRange: '', // 年龄段
-    ageRangeCode: '', // 年龄段code
-    contact: '', // 联系电话
-    acceptSms: false, // 是否接收短信 默认false
-    isSecret: false, // 是否保密 默认false
-    company: '', // 工作单位
-    no: '', // 工单编号
-    title: '', // 工单标题
-    orderType: 0, // 工单类型 默认通用工单
-    acceptType: '', // 受理类型
-    emergencyLevel: 1, // 紧急程度 默认一般
-    hotspotId: '', // 热点问题
-    incidentTime: '', // 事件发生时间
-    areaCode: '', // 区域编码
-    street: '', // 街道
-    isRepeat: 'false', // 是否重复工单 默认否
-    duplicateId: '',//重复工单id
-    duplicateTitle: '', // 重复工单标题
-    pushType: '', // 推送类型
-    pushTypeCode: '', // 推送类型code
-    content: '', // 工单内容
+		channel: '', // 来源频道
+		transferPhone: '', // 转接来源
+		fromPhone: '', // 来电号码
+		employeeName: '', // 员工姓名
+		employeeStaffNo: '', // 员工工号
+		fromName: '', // 来电人姓名
+		fromGender: 1, // 来电人性别 默认先生
+		identityType: 1, // 来电/信人身份 默认市民
+		licenceType: '', // 证件类型
+		licenceTypeCode: '', // 证件类型code
+		licenceNo: '', // 证件号码
+		ageRange: '', // 年龄段
+		ageRangeCode: '', // 年龄段code
+		contact: '', // 联系电话
+		acceptSms: false, // 是否接收短信 默认false
+		isSecret: false, // 是否保密 默认false
+		company: '', // 工作单位
+		no: '', // 工单编号
+		title: '', // 工单标题
+		orderType: 0, // 工单类型 默认通用工单
+		acceptType: '', // 受理类型
+		emergencyLevel: 1, // 紧急程度 默认一般
+		hotspotId: '', // 热点问题
+		incidentTime: '', // 事件发生时间
+		areaCode: '', // 区域编码
+		street: '', // 街道
+		isRepeat: 'false', // 是否重复工单 默认否
+		duplicateId: '', //重复工单id
+		duplicateTitle: '', // 重复工单标题
+		pushType: '', // 推送类型
+		pushTypeCode: '', // 推送类型code
+		content: '', // 工单内容
 	},
 	formLoading: false, // 表单加载状态
 	historyOrderLoading: false, // 历史工单加载状态
@@ -652,7 +711,7 @@ const hotSpotChange = (val: any, e: any) => {
 	state.external = [];
 	state.hotspotExternal = getParentId(e, state.external);
 	state.ruleForm.hotspotSpliceName = val.hotSpotFullName;
-  state.ruleForm.hotspotName = val.hotSpotName;
+	state.ruleForm.hotspotName = val.hotSpotName;
 	knowledgeRetrievalPaged(val.hotSpotName);
 };
 //  知识检索
@@ -710,7 +769,7 @@ const showExpandForm = () => {
 const saveExpandForm = (val: any) => {
 	const acceptTypeMap: any = {
 		30: 'orderReport',
-		35: 'orderComplain'
+		35: 'orderComplain',
 	};
 	const property = acceptTypeMap[state.ruleForm.acceptType];
 	if (property) {
@@ -720,45 +779,42 @@ const saveExpandForm = (val: any) => {
 // 删除不必要的属性
 const deleteUnnecessaryProperties = (obj: any) => {
 	const propertiesToDelete = ['ageRangeObj', 'pushTypeObj', 'licenceTypeObj'];
-	propertiesToDelete.forEach(prop => Reflect.deleteProperty(obj, prop));
+	propertiesToDelete.forEach((prop) => Reflect.deleteProperty(obj, prop));
 	if (obj.acceptType === 30) Reflect.deleteProperty(obj, 'orderComplain');
 	if (obj.acceptType === 35) Reflect.deleteProperty(obj, 'orderReport');
 };
 // 是否打开拓展表单
 const shouldOpenDialog = (obj: any) => obj.orderType === 1 && obj.acceptType && !ExpandFormRef.value.state.validated;
 // 保存
-const save = throttle(() => {
-	ruleFormRef.value.validate((valid: boolean) => {
-		if (valid) {
-			state.ruleForm.hotspotExternal = state.hotspotExternal.join(',');
-			let submitObj = other.deepClone(state.ruleForm);
-			deleteUnnecessaryProperties(submitObj);
-			const addOrderAndNavigate = () => {
-				orderAdd(submitObj).then(() => {
-					ElMessage.success('操作成功');
-					mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
-					mittBus.emit('clearCache', 'order');
-					router.push({
-						path: '/business/order',
-					});
-				});
-			};
-			if (shouldOpenDialog(submitObj)) {
-				ExpandFormRef.value.openDialog(submitObj.acceptType, true);
-			} else {
-				addOrderAndNavigate();
-			}
-		}
-	});
+const save = throttle((formEl: FormInstance | undefined) => {
+	if (!formEl) return;
+	state.ruleForm.hotspotExternal = state.hotspotExternal.join(',');
+	let submitObj = other.deepClone(state.ruleForm);
+	deleteUnnecessaryProperties(submitObj);
+	const addOrderAndNavigate = () => {
+		orderAdd(submitObj).then(() => {
+			ElMessage.success('操作成功');
+			mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
+			mittBus.emit('clearCache', 'order');
+			router.push({
+				path: '/business/order',
+			});
+		});
+	};
+	if (shouldOpenDialog(submitObj)) {
+		ExpandFormRef.value.openDialog(submitObj.acceptType, true);
+	} else {
+		addOrderAndNavigate();
+	}
 }, 500);
 // 选择来点人身份如果是企业 推送分类自动选择助企纾困
-const selectIdentity = (val:number)=>{
-  if(val === 2){
-    state.ruleForm.pushTypeObj = state.pushTypeOptions.find((item:any)=>item.dicDataValue === '8'); // 助企纾困
-    state.ruleForm.pushType = state.ruleForm.pushTypeObj.dicDataName;
-    state.ruleForm.pushTypeCode = state.ruleForm.pushTypeObj.dicDataValue;
-  }
-}
+const selectIdentity = (val: number) => {
+	if (val === 2) {
+		state.ruleForm.pushTypeObj = state.pushTypeOptions.find((item: any) => item.dicDataValue === '8'); // 助企纾困
+		state.ruleForm.pushType = state.ruleForm.pushTypeObj.dicDataName;
+		state.ruleForm.pushTypeCode = state.ruleForm.pushTypeObj.dicDataValue;
+	}
+};
 const processOrder = (submitObj: any, isEdit: boolean) => {
 	const operation = isEdit ? orderEdit : orderAdd;
 	operation(submitObj).then((res) => {
@@ -779,21 +835,16 @@ const handleForm = (submitObj: any, isEdit: boolean) => {
 	}
 };
 // 提交
-const submit = throttle(() => {
-	ruleFormRef.value.validate((valid: boolean) => {
-		if (valid) {
-			state.ruleForm.hotspotExternal = state.hotspotExternal.join(',');
-			let submitObj = other.deepClone(state.ruleForm);
-			deleteUnnecessaryProperties(submitObj);
-			if (state.orderId) {
-				handleForm(submitObj, true);
-			} else {
-				handleForm(submitObj, false);
-			}
-		} else {
-			return false;
-		}
-	});
+const submit = throttle((formEl: FormInstance | undefined) => {
+	if (!formEl) return;
+	state.ruleForm.hotspotExternal = state.hotspotExternal.join(',');
+	let submitObj = other.deepClone(state.ruleForm);
+	deleteUnnecessaryProperties(submitObj);
+	if (state.orderId) {
+		handleForm(submitObj, true);
+	} else {
+		handleForm(submitObj, false);
+	}
 }, 500);
 // 选择是否重复
 const isRepeatChange = (val: string) => {
@@ -806,7 +857,7 @@ const clearRepeat = () => {
 	state.ruleForm.duplicateTitle = '';
 	state.ruleForm.duplicateId = '';
 	state.tableRadio = '';
-  multipleTableRef.value.clearSelection();
+	multipleTableRef.value.clearSelection();
 };
 // 选择重复件
 const selectRepeat = () => {
@@ -818,7 +869,7 @@ const saveSelect = (row: any) => {
 	state.ruleForm.duplicateTitle = row.title;
 	state.tableRadio = row.id;
 
-  multipleTableRef.value!.toggleRowSelection(row, undefined)
+	multipleTableRef.value!.toggleRowSelection(row, undefined);
 	HistoryOrderRef.value.closeDialog();
 };
 // 右边表格选中重复件
@@ -827,7 +878,7 @@ const handleSelectionChange = (row: any) => {
 		state.ruleForm.duplicateId = row.id;
 		state.tableRadio = row.id;
 		state.ruleForm.duplicateTitle = row.title;
-    multipleSelection.value = row;
+		multipleSelection.value = row;
 	}
 };
 // 选中常用意见
@@ -900,11 +951,7 @@ onMounted(async () => {
 	state.formLoading = true;
 	state.loading = true;
 	try {
-		const [area, res, hotspot] = await Promise.all([
-			treeArea(),
-			orderBaseDataAdd(),
-			getKeyWord(),
-		]);
+		const [area, res, hotspot] = await Promise.all([treeArea(), orderBaseDataAdd(), getKeyWord()]);
 		state.acceptTypeOptions = res.result?.acceptTypeOptions ?? [];
 		state.channelOptions = res.result?.channelOptions ?? [];
 		state.emergencyLevelOptions = res.result?.emergencyLevelOptions ?? [];

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

@@ -43,25 +43,25 @@
 									</el-form-item>
 								</template>
 							</el-col>
-              <!-- 转接来源 -->
-              <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
-                <!-- 手动创建 -->
-                <template v-if="state.createBy === 'manual'">
-                  <el-form-item label="转接来源" prop="transferPhone"> 暂无 </el-form-item>
-                </template>
-                <!-- 来电弹单 -->
-                <template v-if="state.createBy === 'tel'">
-                  <el-form-item label="转接来源" prop="transferPhone">
-                    <span>[{{ state.ruleForm.transferPhone }}]</span>
-                  </el-form-item>
-                </template>
-                <!-- 互联网来信 -->
-                <template v-if="state.createBy === 'letter'">
-                  <el-form-item label="转接来源" prop="transferPhone">
-                    <span>[{{ state.ruleForm.transferPhone }}]</span>
-                  </el-form-item>
-                </template>
-              </el-col>
+							<!-- 转接来源 -->
+							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+								<!-- 手动创建 -->
+								<template v-if="state.createBy === 'manual'">
+									<el-form-item label="转接来源" prop="transferPhone"> 暂无 </el-form-item>
+								</template>
+								<!-- 来电弹单 -->
+								<template v-if="state.createBy === 'tel'">
+									<el-form-item label="转接来源" prop="transferPhone">
+										<span>[{{ state.ruleForm.transferPhone }}]</span>
+									</el-form-item>
+								</template>
+								<!-- 互联网来信 -->
+								<template v-if="state.createBy === 'letter'">
+									<el-form-item label="转接来源" prop="transferPhone">
+										<span>[{{ state.ruleForm.transferPhone }}]</span>
+									</el-form-item>
+								</template>
+							</el-col>
 							<!-- 来电号码 -->
 							<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="state.ruleForm.channel === 0">
 								<!-- 手动创建 -->
@@ -397,13 +397,13 @@
 							</el-col>
 							<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
 								<el-form-item label="附件" prop="remark" :rules="[{ required: false, message: '请填写诉求内容', trigger: 'change' }]">
-                  <annex-list ref="AnnexListRef"></annex-list>
+									<annex-list ref="AnnexListRef"></annex-list>
 								</el-form-item>
 							</el-col>
 							<el-col :xs="24" :sm="12" :md="24" :lg="24" :xl="24">
 								<el-form-item>
-									<el-button class="default-button" @click="save" v-auth="'business:order:add'"> 保存 </el-button>
-									<el-button type="primary" v-waves @click="submit" v-auth="'business:order:startWorkflow'"> 提交 </el-button>
+									<el-button class="default-button" @click="save(ruleFormRef)" v-auth="'business:order:add'"> 保存 </el-button>
+									<el-button type="primary" v-waves @click="submit(ruleFormRef)" v-auth="'business:order:startWorkflow'"> 提交 </el-button>
 								</el-form-item>
 							</el-col>
 						</el-row>
@@ -795,57 +795,47 @@ const deleteUnnecessaryProperties = (obj: any) => {
 // 是否打开拓展表单
 const shouldOpenDialog = (obj: any) => obj.orderType === 1 && obj.acceptType && !ExpandFormRef.value.state.validated;
 // 保存
-const save = throttle(() => {
-	ruleFormRef.value.validate((valid: boolean) => {
-		if (valid) {
-			state.ruleForm.hotspotExternal = state.hotspotExternal.join(',');
-			let submitObj = other.deepClone(state.ruleForm);
-			deleteUnnecessaryProperties(submitObj);
-			const editOrderAndNavigate = () => {
-				orderEdit(submitObj).then(() => {
-					ElMessage.success('操作成功');
-					// 关闭当前 tagsView
-					mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
-					mittBus.emit('clearCache', 'order');
-					router.replace({
-						path: '/business/order',
-					});
-				});
-			};
-			if (shouldOpenDialog(submitObj)) {
-				ExpandFormRef.value.openDialog(submitObj.acceptType, true);
-			} else {
-				editOrderAndNavigate();
-			}
-		} else {
-			return false;
-		}
-	});
+const save = throttle((formEl: FormInstance | undefined) => {
+	if (!formEl) return;
+	state.ruleForm.hotspotExternal = state.hotspotExternal.join(',');
+	let submitObj = other.deepClone(state.ruleForm);
+	deleteUnnecessaryProperties(submitObj);
+	const editOrderAndNavigate = () => {
+		orderEdit(submitObj).then(() => {
+			ElMessage.success('操作成功');
+			// 关闭当前 tagsView
+			mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
+			mittBus.emit('clearCache', 'order');
+			router.replace({
+				path: '/business/order',
+			});
+		});
+	};
+	if (shouldOpenDialog(submitObj)) {
+		ExpandFormRef.value.openDialog(submitObj.acceptType, true);
+	} else {
+		editOrderAndNavigate();
+	}
 }, 500);
 // 提交
-const submit = throttle(() => {
-	ruleFormRef.value.validate((valid: boolean) => {
-		if (valid) {
-			state.ruleForm.hotspotExternal = state.hotspotExternal.join(',');
-			let submitObj = other.deepClone(state.ruleForm);
-			deleteUnnecessaryProperties(submitObj);
+const submit = throttle((formEl: FormInstance | undefined) => {
+	if (!formEl) return;
+	state.ruleForm.hotspotExternal = state.hotspotExternal.join(',');
+	let submitObj = other.deepClone(state.ruleForm);
+	deleteUnnecessaryProperties(submitObj);
 
-			const proceedWithSubmission = () => {
-				orderEdit(submitObj).then(() => {
-					processRef.value.openDialog({ id: route.params.id, title: '提交', commonEnum: commonEnum.Seat, processType: 'start' });
-				});
-			};
+	const proceedWithSubmission = () => {
+		orderEdit(submitObj).then(() => {
+			processRef.value.openDialog({ id: route.params.id, title: '提交', commonEnum: commonEnum.Seat, processType: 'start' });
+		});
+	};
 
-			if (submitObj.orderType === 1 && submitObj.acceptType && !ExpandFormRef.value.state.validated) {
-				//如果没有通过展示弹窗
-				ExpandFormRef.value.openDialog(submitObj.acceptType, true);
-			} else {
-				proceedWithSubmission();
-			}
-		} else {
-			return false;
-		}
-	});
+	if (submitObj.orderType === 1 && submitObj.acceptType && !ExpandFormRef.value.state.validated) {
+		//如果没有通过展示弹窗
+		ExpandFormRef.value.openDialog(submitObj.acceptType, true);
+	} else {
+		proceedWithSubmission();
+	}
 }, 500);
 // 选择是否重复
 const isRepeatChange = (val: string) => {

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

@@ -1,218 +0,0 @@
-<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">
-                  <annex-list />
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-        </div>
-      </el-collapse-item>
-    </el-collapse>
-
-    <template #footer>
-			<span class="dialog-footer">
-        <el-button @click="onCancel" class="default-button">取 消</el-button>
-				<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 OrderProcess = defineAsyncComponent(() => import('/@/views/business/order/components/Order-process.vue'));
-const AnnexList = defineAsyncComponent(() => import('/@/components/AnnexList/index.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 onCancel = () => {
-  closeDialog();
-};
-// 提交
-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

@@ -329,8 +329,8 @@ const OrderCirculationRecord = defineAsyncComponent(() => import('/@/views/busin
 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 OrderDelay = defineAsyncComponent(() => import('/@/views/business/delay/components/Order-delay.vue'));
+const OrderSuperVise = defineAsyncComponent(() => import('/@/views/business/supervise/components/Order-supervise.vue'));
 // const AudioPlayer = defineAsyncComponent(() => import('/@/components/AudioPlayer/index.vue'));
 
 // 定义子组件向父组件传值/事件

src/views/business/order/components/Order-expand-form.vue

@@ -566,7 +566,7 @@
 			<template #footer>
 				<span class="dialog-footer">
 					<el-button @click="state.isShowDialog = false" class="default-button">取 消</el-button>
-					<el-button type="primary" @click="saveExpandForm" :loading="state.loading">保 存</el-button>
+					<el-button type="primary" @click="saveExpandForm(expandFormRef)" :loading="state.loading">保 存</el-button>
 				</span>
 			</template>
 		</el-dialog>
@@ -579,7 +579,7 @@ import { useRoute } from 'vue-router';
 import { orderBaseExt, orderDetail } from '/@/api/business/order';
 import other from '/@/utils/other';
 import { treeArea } from '/@/api/business/commonP';
-import { ElMessage } from 'element-plus';
+import {ElMessage, FormInstance} from 'element-plus';
 const emit = defineEmits(['saveExpandForm']);
 // 定义变量内容
 const state = reactive<any>({
@@ -703,8 +703,9 @@ const changeArea = () => {
 	state.expandForm.county = currentNode[0].pathLabels[2];
 };
 // 保存拓展表单
-const saveExpandForm = () => {
-	expandFormRef.value.validate((valid: boolean) => {
+const saveExpandForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) return;
+  formEl.validate((valid: boolean) => {
 		state.validated = valid;
 		if (valid) {
 			let submitObj = other.deepClone(state.expandForm);

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

@@ -1,208 +1,137 @@
 <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">
-                  <annex-list />
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-        </div>
-      </el-collapse-item>
-    </el-collapse>
-
-    <template #footer>
-			<span class="dialog-footer">
-        <el-button @click="onCancel" class="default-button">取 消</el-button>
-				<el-button type="primary" @click="onSubmit" :loading="state.loading" v-auth="'business:order:revoke'">提交</el-button>
-			</span>
-    </template>
-  </el-dialog>
+  <div>
+    <el-dialog v-model="state.isShowDialog" draggable title="撤销工单" append-to-body>
+      <el-form :model="state.ruleForm" label-width="90px" ref="ruleFormRef">
+        <el-row :gutter="35">
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+            <el-form-item label="工单编号">
+              {{ state.ruleForm.no }}
+            </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+            <el-form-item label="工单标题">
+              {{ state.ruleForm.title }}
+            </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+            <el-form-item label="撤销人">
+              {{ state.ruleForm.title }}
+            </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+            <el-form-item label="撤销部门">
+              {{ state.ruleForm.title }}
+            </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+            <el-form-item label="撤销时间">
+              {{ state.ruleForm.title }}
+            </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+            <el-form-item label="发送撤销短信" prop="acceptSms" :rules="[{ required: false, message: '请选择发送督办短信', trigger: 'change' }]">
+              <el-checkbox v-model="state.ruleForm.acceptSms" label="发送撤销短信" />
+            </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+            <el-form-item label="撤销原因" class="textarea" prop="opinion" :rules="[{ required: true, message: '请填写撤销原因', trigger: 'blur' }]">
+              <el-input
+                  v-model="state.ruleForm.opinion"
+                  type="textarea"
+                  :autosize="{ minRows: 10, maxRows: 10 }"
+                  placeholder="请填写撤销原因"
+                  clearable
+                  max-length="2000"
+              >
+              </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">
+              <annex-list />
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <template #footer>
+				<span class="dialog-footer">
+					<el-button @click="onCancel" class="default-button">取 消</el-button>
+					<el-button type="primary" @click="onSubmit(ruleFormRef)" :loading="state.loading">提 交</el-button>
+				</span>
+      </template>
+    </el-dialog>
+  </div>
 </template>
-<script setup lang="ts" name="orderRevoke">
-import {defineAsyncComponent, reactive, ref} from 'vue';
-import {ElMessageBox} from 'element-plus'
+
+<script setup lang="ts" name="orderRevokeDialog">
+import { reactive, ref, defineAsyncComponent } from 'vue';
+import { ElMessageBox, FormInstance } from 'element-plus';
+import { throttle } from '/@/utils/tools';
+import { supplement } from '/@/api/system/workflow';
 
 // 引入组件
 const AnnexList = defineAsyncComponent(() => import('/@/components/AnnexList/index.vue'));
 
 // 定义子组件向父组件传值/事件
-const emit = defineEmits(['onRevokeSuccess']);
+const emit = defineEmits(['onSupplySuccess']);
 // 定义变量内容
 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',
-      },
-    ]
+  isShowDialog: false,
+  ruleForm: {
+    opinion: '',
+    additions: [], // 附件
+    workflowId: '', // 流程id
   },
-  fileList:[],
+  fileList: [],
+  loading: false,
 });
 const ruleFormRef = ref<RefType>();
 // 打开弹窗
-const openDialog = (val:any) => {
-  console.log(val,'撤销参数')
-  state.loading = false;
+const openDialog = async (val: any) => {
+  ruleFormRef.value?.clearValidate();
+  ruleFormRef.value?.resetFields();
+  state.ruleForm = val;
+  state.ruleForm.workflowId = val.workflowId;
   state.isShowDialog = true;
 };
 // 关闭弹窗
 const closeDialog = () => {
   state.isShowDialog = false;
-  state.ruleForm = {};
 };
 // 取消
 const onCancel = () => {
   closeDialog();
 };
 // 提交
-const onSubmit = () => {
-  ElMessageBox.confirm('您确定要撤销吗？', '提示', {
-    confirmButtonText: '确定',
+const onSubmit = throttle((formEl: FormInstance | undefined) => {
+  if (!formEl) return;
+  ElMessageBox.confirm(`确认撤销?`, '提示', {
+    confirmButtonText: '确认',
     cancelButtonText: '取消',
     type: 'warning',
+    draggable: true,
+    cancelButtonClass: 'default-button',
+    autofocus: false,
   })
       .then(() => {
         state.loading = true;
-        setTimeout(() => {
-          state.loading = false;
-          state.isShowDialog = false;
-          emit('onRevokeSuccess');
-        }, 1000);
+        supplement(state.ruleForm)
+            .then(() => {
+              state.loading = false;
+              state.isShowDialog = false;
+              emit('onSupplySuccess');
+            })
+            .catch(() => {
+              state.loading = false;
+              state.isShowDialog = false;
+            });
       })
-      .catch(() => {
-        // 取消
-      });
-};
+      .catch(() => {});
+}, 1000);
+// 暴露变量
 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>
+<style lang="scss" scoped></style>

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

@@ -1,218 +0,0 @@
-<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">
-                  <annex-list />
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-        </div>
-      </el-collapse-item>
-    </el-collapse>
-
-    <template #footer>
-			<span class="dialog-footer">
-        <el-button @click="onCancel" class="default-button">取 消</el-button>
-				<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 OrderProcess = defineAsyncComponent(() => import('/@/views/business/order/components/Order-process.vue'));
-const AnnexList = defineAsyncComponent(() => import('/@/components/AnnexList/index.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 onCancel = () => {
-  closeDialog();
-};
-// 提交
-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

@@ -3,24 +3,29 @@
 		<el-dialog v-model="state.isShowDialog" draggable title="补充信息" append-to-body>
 			<el-form :model="state.ruleForm" label-width="90px" ref="ruleFormRef">
 				<el-row :gutter="35">
-					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
-						<el-form-item label="工单标题" class="mb10">
+					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+						<el-form-item label="工单编号">
+							{{ state.showForm.no }}
+						</el-form-item>
+					</el-col>
+					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+						<el-form-item label="工单标题">
 							{{ state.showForm.title }}
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
-						<el-form-item label="工单编码" class="mb10">
-							{{ state.showForm.no }}
+						<el-form-item label="补充人">
+							{{ state.showForm.title }}
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
-						<el-form-item label="受理类型" class="mb10">
-							{{ state.showForm.acceptTypeText }}
+						<el-form-item label="补充部门">
+							{{ state.showForm.title }}
 						</el-form-item>
 					</el-col>
-					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
-						<el-form-item label="热点分类" class="mb10">
-							{{ state.showForm.hotspotSpliceName }}
+					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+						<el-form-item label="补充时间">
+							{{ state.showForm.title }}
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
@@ -38,7 +43,7 @@
 					</el-col>
 					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
 						<el-form-item label="附件" prop="additions">
-              <annex-list />
+							<annex-list />
 						</el-form-item>
 					</el-col>
 				</el-row>
@@ -46,7 +51,7 @@
 			<template #footer>
 				<span class="dialog-footer">
 					<el-button @click="onCancel" class="default-button">取 消</el-button>
-					<el-button type="primary" @click="onSubmit" :loading="state.loading">提 交</el-button>
+					<el-button type="primary" @click="onSubmit(ruleFormRef)" :loading="state.loading">提 交</el-button>
 				</span>
 			</template>
 		</el-dialog>
@@ -55,7 +60,7 @@
 
 <script setup lang="ts" name="orderSupply">
 import { reactive, ref, defineAsyncComponent } from 'vue';
-import { ElMessageBox } from 'element-plus';
+import { ElMessageBox, FormInstance } from 'element-plus';
 import { throttle } from '/@/utils/tools';
 import { supplement } from '/@/api/system/workflow';
 
@@ -94,35 +99,30 @@ const onCancel = () => {
 	closeDialog();
 };
 // 提交
-const onSubmit = throttle(() => {
-	ruleFormRef.value.validate((valid: boolean) => {
-		if (valid) {
-			ElMessageBox.confirm(`确认提交?`, '提示', {
-				confirmButtonText: '确认',
-				cancelButtonText: '取消',
-				type: 'warning',
-				draggable: true,
-				cancelButtonClass: 'default-button',
-				autofocus: false,
-			})
+const onSubmit = throttle((formEl: FormInstance | undefined) => {
+	if (!formEl) return;
+	ElMessageBox.confirm(`确认补充?`, '提示', {
+		confirmButtonText: '确认',
+		cancelButtonText: '取消',
+		type: 'warning',
+		draggable: true,
+		cancelButtonClass: 'default-button',
+		autofocus: false,
+	})
+		.then(() => {
+			state.loading = true;
+			supplement(state.ruleForm)
 				.then(() => {
-					state.loading = true;
-					supplement(state.ruleForm)
-						.then(() => {
-							state.loading = false;
-							state.isShowDialog = false;
-							emit('onSupplySuccess');
-						})
-						.catch(() => {
-							state.loading = false;
-							state.isShowDialog = false;
-						});
+					state.loading = false;
+					state.isShowDialog = false;
+					emit('onSupplySuccess');
 				})
-				.catch(() => {});
-		} else {
-			return false;
-		}
-	});
+				.catch(() => {
+					state.loading = false;
+					state.isShowDialog = false;
+				});
+		})
+		.catch(() => {});
 }, 1000);
 // 暴露变量
 defineExpose({

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

@@ -0,0 +1,146 @@
+<template>
+  <el-dialog v-model="state.isShowDialog" draggable title="发起督办" ref="dialogRef" width="50%" append-to-body destroy-on-close>
+    <div class="collapse-container pb1">
+      <el-form label-width="110px" ref="ruleFormRef">
+        <el-row :gutter="35">
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+            <el-form-item label="工单编号"> {{ state.ruleForm.no }} </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+            <el-form-item label="工单标题"> {{ state.ruleForm.title }} </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+            <el-form-item label="督办人"> {{ state.ruleForm.title }} </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+            <el-form-item label="督办部门"> {{ state.ruleForm.title }} </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+            <el-form-item label="督办时间"> {{ state.ruleForm.title }} </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+            <el-form-item label="督办回复时限" prop="incidentTime" :rules="[{ required: true, message: '请输入延期申请数量', trigger: 'blur' }]">
+              <el-date-picker v-model="state.ruleForm.incidentTime" type="datetime"  placeholder="请选择事发时间" value-format="YYYY-MM-DD[T]HH:mm:ss" class="w100" />
+            </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
+            <el-form-item label="被督办部门"  prop="title" :rules="[{ required: true, message: '请选择被督办部门', trigger: 'change' }]">
+              <el-select v-model="state.ruleForm.title" placeholder="请选择被督办部门" 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>
+          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
+            <el-form-item label="发送督办短信" prop="acceptSms" :rules="[{ required: false, message: '请选择发送督办短信', trigger: 'change' }]">
+              <el-checkbox v-model="state.ruleForm.acceptSms" label="发送督办短信" />
+            </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+            <el-form-item label="督办内容" prop="handleResult" :rules="[{ required: true, message: '请填写督办内容', trigger: 'blur' }]">
+              <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="handleResult" :rules="[{ required: false, message: '请选择附件', trigger: 'change' }]">
+              <annex-list />
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </div>
+    <template #footer>
+			<span class="dialog-footer">
+        <el-button @click="onCancel" class="default-button">取 消</el-button>
+				<el-button type="primary" @click="onSubmit(ruleFormRef)" :loading="state.loading" v-auth="'business:order:delay'">提交</el-button>
+			</span>
+    </template>
+  </el-dialog>
+</template>
+<script setup lang="ts" name="businessSuperviseDialog">
+import {defineAsyncComponent, reactive, ref} from 'vue';
+import {ElMessageBox, FormInstance} from 'element-plus';
+import { VoiceInterfaceObject } from '/@/utils/PhoneScript';
+
+// 引入组件
+const AnnexList = defineAsyncComponent(() => import('/@/components/AnnexList/index.vue'));
+
+// 定义子组件向父组件传值/事件
+const emit = defineEmits(['updateList']);
+// 定义变量内容
+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',
+      },
+    ]
+  },
+});
+const ruleFormRef = ref<RefType>();
+// 打开弹窗
+const openDialog = () => {
+  state.loading = false;
+  state.isShowDialog = true;
+};
+// 关闭弹窗
+const closeDialog = () => {
+  state.isShowDialog = false;
+  state.ruleForm = {};
+};
+// 取消
+const onCancel = () => {
+  closeDialog();
+};
+// 呼叫
+const onCall = ()=>{
+  // 呼叫外部电话
+  VoiceInterfaceObject.DialOut(state.ruleForm.fromPhone);
+}
+// 提交
+const onSubmit = (formEl: FormInstance | undefined) => {
+  if (!formEl) return;
+  ElMessageBox.confirm('您确定要提交吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning',
+  })
+      .then(() => {
+        state.loading = true;
+        setTimeout(() => {
+          state.loading = false;
+          state.isShowDialog = false;
+          emit('updateList');
+        }, 1000);
+      })
+      .catch(() => {
+        // 取消
+      });
+};
+defineExpose({
+  openDialog,
+  closeDialog,
+});
+</script>
+
+<style lang="scss" scoped>
+.collapse-box {
+
+}
+</style>

src/views/business/supervise/index.vue

@@ -182,6 +182,8 @@
     </el-card>
     <!-- 工单详情 -->
     <order-detail ref="OrderDetailRef" @updateList="queryList" />
+    <!-- 督办内容 -->
+    <order-supervise ref="OrderSuperviseRef" @updateList="queryList" />
   </div>
 </template>
 <script setup lang="ts" name="businessSupervise">
@@ -194,6 +196,7 @@ import { formatDate } from '/@/utils/formatTime';
 import {useRouter} from "vue-router";
 // 引入组件
 const OrderDetail = defineAsyncComponent(() => import('/@/views/business/order/components/Order-detail.vue'));
+const OrderSupervise = defineAsyncComponent(() => import('/@/views/business/supervise/components/Order-supervise.vue'));
 
 // 定义变量内容
 const ruleFormRef = ref<RefType>(); // 表单ref
@@ -225,7 +228,7 @@ const state = reactive(<any>{
     pushTypeOptions: '', //
     PushTypeCode: '', //推送类型
   },
-  tableList: [], //表单
+  tableList: [{}], //表单
   loading: false, // 加载
   total: 0, // 总数
   acceptTypeOptions: [], //受理类型
@@ -308,8 +311,9 @@ const onExport = () => {
   console.log('导出');
 };
 // 查看督办详情
+const OrderSuperviseRef = ref<RefType>();
 const onDetail = (row: any) => {
-
+  OrderSuperviseRef.value.openDialog()
 };
 onMounted(async () => {
   await getBaseData();

src/views/system/user/component/User-add.vue

@@ -51,7 +51,7 @@
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
 						<el-form-item label="默认分机" prop="defaultTelNo" :rules="[{ required: false, message: '请选择默认分机', trigger: 'change' }]">
 							<el-select v-model="state.ruleForm.defaultTelNo" placeholder="请选择默认分机" class="w100 clearable">
-								<el-option v-for="item in state.telsList" :key="item.no" :label="item.no" :value="item.no" />
+								<el-option v-for="item in state.telsList" :key="item.value" :label="item.label" :value="item.value" />
 							</el-select>
 						</el-form-item>
 					</el-col>
@@ -98,7 +98,7 @@ import { reactive, ref } from 'vue';
 import { ElMessage } from 'element-plus';
 import { throttle } from '/@/utils/tools';
 import { addUser, getCanUseOrg, getBaseData, getRoles } from '/@/api/system/user';
-import { getTelsList } from '/@/api/device/phone';
+import { getTelList } from '/@/api/public/wex';
 
 // 定义子组件向父组件传值/事件
 const emit = defineEmits(['updateList']);
@@ -155,10 +155,14 @@ const getKnowledgeList = () => {
 	state.ruleForm.orgCode = currentNode[0]?.data.orgCode ?? '';
 };
 // 获取分机列表
-const getTelsListFn = () => {
-	getTelsList().then((res: any) => {
-		state.telsList = res?.result ?? [];
-	});
+const getTelsListFn = async (object?:object) => {
+  const res: any = await getTelList(object);
+  state.telsList = res?.data ?? [];
+  state.telsList = state.telsList.map((item: any) => ({
+    value: item.device,
+    label: item.device,
+    ...item
+  }))
 };
 // 查询页面基础信息
 const getBaseDataFn = () => {

src/views/system/user/component/User-edit.vue

@@ -51,7 +51,7 @@
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
 						<el-form-item label="默认分机" prop="defaultTelNo" :rules="[{ required: false, message: '请选择默认分机', trigger: 'change' }]">
 							<el-select v-model="state.ruleForm.defaultTelNo" placeholder="请选择默认分机" class="w100" clearable>
-								<el-option v-for="item in state.telsList" :key="item.no" :label="item.no" :value="item.no" />
+                <el-option v-for="item in state.telsList" :key="item.value" :label="item.label" :value="item.value" />
 							</el-select>
 						</el-form-item>
 					</el-col>
@@ -99,7 +99,7 @@ import type { FormInstance } from 'element-plus';
 import { ElMessage } from 'element-plus';
 import { throttle } from '/@/utils/tools';
 import { updateUser, getCanUseOrg, getBaseData, getRoles } from '/@/api/system/user';
-import { getTelsList } from '/@/api/device/phone';
+import { getTelList } from '/@/api/public/wex';
 import other from '/@/utils/other';
 // 定义子组件向父组件传值/事件
 const emit = defineEmits(['updateList']);
@@ -161,10 +161,14 @@ const getKnowledgeList = () => {
 	state.ruleForm.orgCode = currentNode[0]?.data.orgCode ?? '';
 };
 // 获取分机列表
-const getTelsListFn = () => {
-	getTelsList().then((res: any) => {
-		state.telsList = res?.result ?? [];
-	});
+const getTelsListFn = async (object?:object) => {
+  const res: any = await getTelList(object);
+  state.telsList = res?.data ?? [];
+  state.telsList = state.telsList.map((item: any) => ({
+    value: item.device,
+    label: item.device,
+    ...item
+  }))
 };
 // 查询页面基础信息
 const getBaseDataFn = () => {

src/views/tels/blacklist/component/Blacklist-add.vue

@@ -63,7 +63,7 @@
 			<template #footer>
 				<span class="dialog-footer">
 					<el-button @click="closeDialog" class="default-button">取 消</el-button>
-					<el-button type="primary" @click="onSubmit">保 存</el-button>
+					<el-button type="primary" @click="onSubmit(blacklistFormRef)">保 存</el-button>
 				</span>
 			</template>
 		</el-dialog>
@@ -72,7 +72,7 @@
 
 <script lang="ts" setup name="blackAdd">
 import { ref, reactive } from 'vue';
-import { ElMessage } from 'element-plus';
+import {ElMessage, FormInstance} from 'element-plus';
 import { addBlacklist } from '/@/api/tels/blacklist';
 
 // 定义子组件向父组件传值/事件
@@ -113,7 +113,8 @@ const closeDialog = () => {
 	emit('closeDialog');
 };
 // 新增保存
-const onSubmit = () => {
+const onSubmit = (formEl: FormInstance | undefined) => {
+  if (!formEl) return;
 	blacklistFormRef.value.validate((valid: boolean) => {
 		if (valid) {
 			addBlacklist(state.ruleForm).then(() => {