Forráskód Böngészése

reactor:333 新增【工单修改】功能;

zhangchong 6 hónapja
szülő
commit
a4eb708b29

+ 21 - 0
src/api/todo/center.ts

@@ -85,4 +85,25 @@ export const migrationOrderVisitList = () => {
     url: `/api/v1/Order/ordervisit/migration`,
     method: 'get',
   });
+}
+/**
+ * @description 获取工单修改记录列表
+ * @param {object} params
+ */
+export const getOrderModifyRecord = (params: object) => {
+  return request({
+    url: `/api/v1/Order/order_modify_records/list`,
+    method: 'get',
+    params
+  });
+}
+/**
+ * @description 获取工单修改记录详情
+ * @param {string} id
+ */
+export const getOrderModifyRecordDetail = (id: string) => {
+  return request({
+    url: `/api/v1/Order/order_modify_records/getinfo/${id}`,
+    method: 'get',
+  });
 }

+ 0 - 1
src/theme/app.scss

@@ -495,7 +495,6 @@ li {
 	height: 15px;
 	border-radius: 50%;
 	display: inline-block;
-	margin-right: 5px;
 }
 /* 正常状态样式 */
 .overdue-status-0 {

+ 899 - 0
src/views/todo/edit/components/Edit-order.vue

@@ -0,0 +1,899 @@
+<template>
+	<el-drawer v-model="state.dialogVisible" title="修改工单信息" destroy-on-close size="50%" append-to-body>
+		<el-form label-width="110px" ref="ruleFormRef" :model="state.ruleForm" v-loading="state.loading" scroll-to-error>
+			<el-row :gutter="10">
+				<el-col>
+					<p class="border-title mb10">来电信息</p>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="来源渠道" prop="channel" :rules="[{ required: true, message: '请选择来源渠道', trigger: 'change' }]">
+						<el-select
+							v-model="state.ruleForm.channel"
+							placeholder="请选择来源渠道"
+							class="w100"
+							clearable
+							value-key="dicDataValue"
+							@change="changeChannel"
+						>
+							<el-option v-for="item in state.channelOptions" :value="item" :key="item.dicDataValue" :label="item.dicDataName" />
+						</el-select>
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="转接来源" prop="transferPhone">
+						<span v-if="state.ruleForm.transferPhone">{{ state.ruleForm.transferPhone }}</span>
+						<template v-else>暂无</template>
+						<span class="ml5">({{ formatDate(state.ruleForm.startTime, 'YYYY-mm-dd HH:MM:SS') }})</span>
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="state.ruleForm.sourceChannelCode === 'RGDH'">
+					<el-form-item label="来电号码" prop="fromPhone" :rules="[{ required: true, message: '请填写来电号码', trigger: 'blur' }]">
+						<el-input v-model="state.ruleForm.fromPhone" 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="受理人">
+						<span>{{ state.ruleForm.acceptorName }}</span>
+						<el-button
+							plain
+							title="录音文件"
+							size="small"
+							type="primary"
+							class="ml8"
+							@click="recordFile(state.ruleForm)"
+							v-if="state.ruleForm?.recordingAbsolutePath"
+							>录音文件</el-button
+						>
+					</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-row class="w100">
+							<el-col :xs="24" :sm="24" :md="24" :lg="18" :xl="18">
+								<el-input v-model="state.ruleForm.fromName" placeholder="请填写来电人姓名" clearable @input="inputName"> </el-input>
+							</el-col>
+							<el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6" style="text-align: center">
+								<el-checkbox v-model="state.ruleForm.isSecret" label="保密" />
+							</el-col>
+						</el-row>
+					</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-radio-group v-model="state.ruleForm.fromGender">
+							<el-radio :value="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-radio-group v-model="state.ruleForm.identityType" @change="selectIdentity">
+							<el-radio :value="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="contact" :rules="[{ required: false, message: '请填写联系电话', trigger: 'blur' }]">
+						<el-input v-model="state.ruleForm.contact" placeholder="请填写联系电话" clearable> </el-input>
+					</el-form-item>
+				</el-col>
+				<!--		宜宾特殊字段		-->
+				<template v-if="['YiBin'].includes(themeConfig.appScope)">
+					<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="changeLicenceType"
+							>
+								<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: false, 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="enterpriseName"
+							:rules="[{ required: state.ruleForm.identityType === 2, message: '请填写企业名称', trigger: 'blur' }]"
+						>
+							<el-input v-model="state.ruleForm.enterpriseName" 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="zhuanBanMingCheng" :rules="[{ required: false, message: '请填写专班名称', trigger: 'blur' }]">
+							<el-input v-model="state.ruleForm.zhuanBanMingCheng" placeholder="请填写专班名称" clearable>
+								<template #append>
+									<el-button type="primary" @click="handleSelect"><SvgIcon name="ele-Search" class="mr4" /> 查询企业</el-button>
+								</template>
+							</el-input>
+						</el-form-item>
+					</el-col>
+				</template>
+				<el-col>
+					<p class="border-title mb10">诉求信息</p>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" v-if="state.ruleForm.no">
+					<el-form-item label="工单编码">
+						{{ state.ruleForm.no }} <span v-if="state.ruleForm?.password">【{{ state.ruleForm.password }}】</span>
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="拓展信息">
+						<el-button @click="showExpandForm" :loading="extraLoading">
+							<SvgIcon name="ele-CirclePlus" class="mr3" size="16px" /> 拓展信息
+						</el-button>
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="受理类型" prop="acceptTypeObj" :rules="[{ required: true, message: '请选择受理类型', trigger: 'change' }]">
+						<el-select
+							v-model="state.ruleForm.acceptTypeObj"
+							placeholder="请选择受理类型"
+							class="w100"
+							value-key="dicDataValue"
+							clearable
+							@change="changeAcceptType"
+						>
+							<el-option
+								v-for="item in state.acceptTypeOptions"
+								:key="item.dicDataValue"
+								:disabled="item.disabled"
+								:label="item.dicDataName"
+								:value="item"
+							/>
+						</el-select>
+					</el-form-item>
+				</el-col>
+				<template v-if="['YiBin'].includes(themeConfig.appScope)">
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+						<el-form-item
+							label="重点关注事件"
+							prop="focusOnEventsArr"
+							:rules="[{ required: false, message: '请选择重点关注事件', trigger: 'change' }]"
+						>
+							<el-select v-model="state.ruleForm.focusOnEventsArr" placeholder="请选择重点关注事件" class="w100" multiple @change="changeFocusEvent">
+								<el-option v-for="item in state.focusOnEvents" :key="item.dicDataValue" :label="item.dicDataName" :value="item.dicDataValue" />
+							</el-select>
+						</el-form-item>
+					</el-col>
+				</template>
+				<template v-if="['ZiGong','LuZhou'].includes(themeConfig.appScope)">
+					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+						<el-form-item label="重点标签" prop="focusOnEventsArr" :rules="[{ required: false, message: '请选择重点标签', trigger: 'change' }]">
+							<el-checkbox-group v-model="state.ruleForm.focusOnEventsArr" @change="changeFocusEvent">
+								<el-checkbox :label="item.dicDataName" :value="item.dicDataValue" v-for="item in state.focusOnEvents" :key="item.dicDataValue" />
+							</el-checkbox-group>
+						</el-form-item>
+					</el-col>
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+						<el-form-item label="工单标签" prop="orderTagObj" :rules="[{ required: false, message: '请选择工单标签', trigger: 'change' }]">
+							<el-select
+								v-model="state.ruleForm.orderTagObj"
+								placeholder="请选择工单标签"
+								class="w100"
+								clearable
+								value-key="dicDataValue"
+								@change="changeOrderTag"
+							>
+								<el-option v-for="item in state.orderTags" :key="item.dicDataValue" :label="item.dicDataName" :value="item" />
+							</el-select>
+						</el-form-item>
+					</el-col>
+				</template>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="推送分类" prop="orderPushTypes" :rules="[{ required: false, message: '请选择推送分类', trigger: 'change' }]">
+						<el-select v-model="state.ruleForm.orderPushTypes" placeholder="请选择推送分类" class="w100" clearable value-key="pushTypeCode" multiple>
+							<el-option v-for="item in state.pushTypeOptions" :key="item.pushTypeCode" :label="item.pushType" :value="item" />
+						</el-select>
+					</el-form-item>
+				</el-col>
+				<!-- 宜宾特殊需求,新增一个事件分类可以自行维护(辅助功能-事件分类管理) -->
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" v-if="AppConfigInfo.isCustomEvent">
+					<el-form-item label="事件分类" prop="eventCategoryId" :rules="[{ required: true, message: '请选择事件分类', trigger: 'change' }]">
+						<event-select
+							@change="chooseEvent"
+							v-model="state.ruleForm.eventCategoryId"
+							v-model:externalArr="state.eventCategoryExternal"
+							placeholder="请选择事件分类"
+							clearable
+						/>
+					</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' }]">
+						<hot-spot-select
+							v-model="state.ruleForm.hotspotId"
+							v-model:externalArr="state.hotspotExternal"
+							@change="chooseHotSpot"
+							placeholder="请选择热点分类"
+							clearable
+							@getCurrentData="getCurrentData"
+						/>
+					</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>
+					</el-col>
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+						<el-form-item label="事件目的" prop="incidentPurpose" :rules="[{ required: false, message: '请填写事件目的', trigger: 'blur' }]">
+							<el-input v-model="state.ruleForm.incidentPurpose" 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="areaCode"
+								:rules="[{ required: true, message: '请选择事发地址', trigger: 'change' }]"
+								v-loading="addressLoading"
+							>
+								<el-cascader
+									:options="state.areaOptions"
+									filterable
+									:props="{ value: 'id', label: 'areaName', emitPath: false, checkStrictly: true }"
+									placeholder="请选择事发地址"
+									class="w100"
+									v-model="state.ruleForm.areaCode"
+									ref="areaRef"
+									@change="changeArea"
+								>
+								</el-cascader>
+							</el-form-item>
+						</el-col>
+						<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+							<el-form-item
+								label=""
+								prop="street"
+								:rules="[{ required: false, message: '请填写详细地址', trigger: 'blur' }]"
+								label-width="10px"
+								class="w100 flex"
+							>
+								<el-col :xs="24" :sm="24" :md="24" :lg="16" :xl="16">
+									<el-input v-model="state.ruleForm.street" placeholder="请填写详细地址" clearable> </el-input>
+								</el-col>
+							</el-form-item>
+						</el-col>
+						<div v-if="showRepeatEvent" class="color-danger mb10" style="margin-left: 110px">
+							【{{ state.ruleForm.address }}】下存在多起【{{ state.ruleForm.hotspotSpliceName }}】事件,点击前往查看或右侧添加重复性事件
+							<el-button type="primary" link style="padding: 0 0 3px" @click="onRepeatEvent"> 查看详情</el-button>
+						</div>
+					</el-row>
+				</el-col>
+				<!-- 系统配置 可以配置是否开启重复工单 -->
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" v-if="AppConfigInfo.isOpenRepeatedWorkOrders">
+					<el-row>
+						<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-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-input v-model="state.ruleForm.duplicateTitle" placeholder="请选择重复件" readonly>
+									<template #suffix>
+										<el-button link type="danger" v-if="state.ruleForm.duplicateTitle" @click="clearRepeat" title="清除历史工单">
+											<SvgIcon name="ele-Delete" size="16px" />
+										</el-button>
+										<el-button link type="primary" class="ml1" @click="selectRepeat" title="选择历史工单">
+											<SvgIcon name="iconfont icon-tianjiatuozhanxinxi" size="18px" />
+										</el-button>
+									</template>
+								</el-input>
+							</el-form-item>
+						</el-col>
+					</el-row>
+				</el-col>
+				<!-- 宜宾特殊需求,可配置开关 是否开启是否市州互转 -->
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" v-if="AppConfigInfo.isTranspondCity">
+					<el-row>
+						<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+							<el-form-item label="是否市州互转" prop="transpond" :rules="[{ required: true, message: '请选择是否市州互转', trigger: 'change' }]">
+								<el-select v-model="state.ruleForm.transpond" placeholder="请选择是否市州互转" class="w100" @change="changeTransPond">
+									<el-option :key="true" label="是" :value="true" />
+									<el-option :key="false" label="否" :value="false" />
+								</el-select>
+							</el-form-item>
+						</el-col>
+						<!-- 必填,若“是否市州互转”为“是”,则展示选择市州选择框 -->
+						<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="state.ruleForm.transpond">
+							<el-form-item
+								label=""
+								prop="transpondCityObj"
+								label-width="10px"
+								:rules="[{ required: true, message: '请选择互转市州', trigger: 'change' }]"
+							>
+								<el-select
+									v-model="state.ruleForm.transpondCityObj"
+									placeholder="请选择互转市州"
+									class="w100"
+									value-key="dicDataValue"
+									@change="changeTranspondCity"
+								>
+									<el-option v-for="item in state.transpondCity" :key="item.dicDataValue" :label="item.dicDataName" :value="item" />
+								</el-select>
+							</el-form-item>
+						</el-col>
+					</el-row>
+				</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-input v-model="state.ruleForm.title" placeholder="请填写工单标题" clearable @input="inputTitle"> </el-input>
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+					<!--									showTextCheck-->
+					<el-form-item label="受理内容" prop="content" :rules="[{ required: true, message: '请填写受理内容', trigger: 'blur' }]">
+						<common-advice
+							@chooseAdvice="chooseAdvice"
+							v-model="state.ruleForm.content"
+							placeholder="请填写受理内容"
+							:loading="state.formLoading"
+							:commonEnum="commonEnum.Seat"
+						/>
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+					<el-form-item label="中心意见" prop="centerOpinion" :rules="[{ required: false, message: '请填写中心意见', trigger: 'blur' }]">
+						<el-input
+							v-model="state.ruleForm.centerOpinion"
+							placeholder="请填写中心意见"
+							type="textarea"
+							:autosize="{ minRows: 4, maxRows: 8 }"
+						></el-input>
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+					<el-form-item label="承办意见" prop="fileOpinion" :rules="[{ required: false, message: '请填写承办意见', trigger: 'blur' }]">
+						<el-input
+							v-model="state.ruleForm.fileOpinion"
+							placeholder="请填写承办意见"
+							type="textarea"
+							:autosize="{ minRows: 4, maxRows: 8 }"
+						></el-input>
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" v-if="state.ruleForm.orderRemarks?.length">
+					<el-form-item label="备注信息">
+						<el-row v-for="(item, index) in state.ruleForm.orderRemarks" class="w100 mb10" :key="index">
+							<el-col class="formatted-text">备注信息:{{ item.remark }} </el-col>
+							<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">备注人:{{ item.remarkUser }} </el-col>
+							<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">备注日期:{{ formatDate(item.remarkTime, 'YYYY-mm-dd HH:MM:SS') }}</el-col>
+						</el-row>
+					</el-form-item>
+				</el-col>
+			</el-row>
+		</el-form>
+		<template #footer>
+			<span class="dialog-footer">
+				<el-button @click="closeDrawer" class="default-button" :loading="state.loading">取消</el-button>
+				<el-button type="primary" @click="save(ruleFormRef)" :loading="state.loading"> 保存 </el-button>
+			</span>
+		</template>
+	</el-drawer>
+	<!-- 拓展表单 -->
+	<expand-form ref="ExpandFormRef" @saveExpandForm="saveExpandForm" :orderDetail="state.ruleForm" :extra="extra" />
+	<!-- 企业搜索 -->
+	<company-search ref="companySearchRef" @selectCompany="selectCompany" />
+	<!-- 重复工单选择 -->
+	<order-repeat-select ref="orderRepeatSelectRef" @orderRepeatSuccess="orderRepeatSuccess" />
+	<!-- 播放录音 -->
+	<play-record ref="playRecordRef" />
+</template>
+<script setup lang="ts">
+import { defineAsyncComponent, onMounted, reactive, ref, watch } from 'vue';
+import { formatDate } from '@/utils/formatTime';
+import { FormInstance, ElMessageBox, ElMessage } from 'element-plus';
+import { orderBaseDataAdd, orderBaseExt, orderDetail, orderEdit } from '@/api/business/order';
+import { transformFile } from '@/utils/tools';
+import { commonEnum } from '@/utils/constants';
+import { treeArea } from '@/api/auxiliary/area';
+import { useAppConfig } from '@/stores/appConfig';
+import { storeToRefs } from 'pinia';
+import { orderRepeatEvent } from '@/api/business/repeatEvent';
+import { useThemeConfig } from '@/stores/themeConfig';
+
+const OrderRepeatSelect = defineAsyncComponent(() => import('@/views/todo/seats/accept/Order-repeat-select.vue')); // 选择重复工单
+const CommonAdvice = defineAsyncComponent(() => import('@/components/CommonAdvice/index.vue')); // 常用意见
+const EventSelect = defineAsyncComponent(() => import('@/components/Hotspot/event.vue')); // 选择事件
+const HotSpotSelect = defineAsyncComponent(() => import('@/components/Hotspot/index.vue')); // 选择热点
+const ExpandForm = defineAsyncComponent(() => import('@/views/todo/seats/accept/Expand-form.vue')); // 拓展表单
+const CompanySearch = defineAsyncComponent(() => import('@/views/todo/seats/accept/Company-search.vue')); // 企业搜索
+const PlayRecord = defineAsyncComponent(() => import('@/components/PlayRecord/index.vue')); // 播放录音
+// 定义变量内容
+const state = reactive<any>({
+	dialogVisible: false, // 是否显示弹窗
+	loading: false, // 是否显示加载
+	ruleForm: {},
+	formLoading: false, // 表单加载状态
+	hotspotExternal: [], // 热点分类外部数据
+	eventCategoryExternal: [], // 事件分类外部数据
+	acceptTypeOptions: [], // 受理类型
+	channelOptions: [], // 来源频道
+	genderOptions: [], // 性别
+	identityTypeOptions: [], //来电主体
+	licenceTypeOptions: [], // 证件类型
+	ageRangeOptions: [], // 年龄段
+	pushTypeOptions: [], //推送分类
+	areaOptions: [], //省市区
+	transpondCity: [],
+	repeatOptions: [
+		//是否重复
+		{
+			value: '是',
+			key: 'true',
+		},
+		{
+			value: '否',
+			key: 'false',
+		},
+	],
+});
+const appConfigStore = useAppConfig();
+const { AppConfigInfo } = storeToRefs(appConfigStore); // 系统配置信息
+const storesThemeConfig = useThemeConfig();
+const { themeConfig } = storeToRefs(storesThemeConfig);
+// 查看工单详情
+const getOrderDetail = async (id: string) => {
+	state.loading = true;
+	try {
+		const { result } = await orderDetail(id);
+		state.ruleForm = result;
+
+		// 如果获取到id 调用查询详情
+		state.ruleForm = Object.assign(state.ruleForm, result);
+		state.ruleForm.files = transformFile(result.files);
+		if (result.duplicateIds && result.duplicateIds.length) {
+			// 是否重复
+			state.ruleForm.isRepeat = 'true';
+			state.ruleForm.duplicateTitle = '已选择';
+		} else {
+			state.ruleForm.isRepeat = 'false';
+		}
+		if (state.ruleForm.focusOnEvents) {
+			// 重点关注事项
+			state.ruleForm.focusOnEventsArr = result.focusOnEvents.split(',');
+		}
+
+		if (state.ruleForm.sourceChannelCode) {
+			state.ruleForm.channel = {
+				// 来源渠道
+				dicDataValue: state.ruleForm.sourceChannelCode,
+				dicDataName: state.ruleForm.sourceChannel,
+			};
+		}
+		if (state.ruleForm.hotspotExternal) {
+			//热点分类默认展开
+			state.hotspotExternal = state.ruleForm.hotspotExternal.split(',');
+		}
+		if (state.ruleForm.eventCategoryExternal) {
+			//热点分类默认展开
+			state.eventCategoryExternal = state.ruleForm.eventCategoryExternal.split(',');
+		}
+		if (state.ruleForm.licenceTypeCode) {
+			state.ruleForm.licenceTypeObj = {
+				// 证件类型
+				dicDataValue: state.ruleForm.licenceTypeCode,
+				dicDataName: state.ruleForm.licenceType,
+			};
+		}
+		if (state.ruleForm.orderTagCode) {
+			state.ruleForm.orderTagObj = {
+				// 工单标签
+				dicDataValue: state.ruleForm.orderTagCode,
+				dicDataName: state.ruleForm.orderTag,
+			};
+		}
+
+		if (!state.ruleForm.acceptType) {
+			// 外部输入数据没有受理名称和热点名称 需要根据code调用一次change事件获取
+			const currentAcceptType = state.acceptTypeOptions.find((item: any) => {
+				return item.dicDataValue === state.ruleForm.acceptTypeCode;
+			});
+			state.ruleForm.acceptType = currentAcceptType?.dicDataName ?? '';
+		}
+		if (state.ruleForm.acceptTypeCode) {
+			state.ruleForm.acceptTypeObj = {
+				// 受理类型
+				dicDataValue: state.ruleForm.acceptTypeCode,
+				dicDataName: state.ruleForm.acceptType,
+			};
+		}
+		if (state.ruleForm.transpondCityValue) {
+			state.ruleForm.transpondCityObj = {
+				// 市州互转
+				dicDataValue: state.ruleForm.transpondCityValue,
+				dicDataName: state.ruleForm.transpondCityName,
+			};
+		}
+		state.loading = false;
+	} catch (error) {
+		state.loading = false;
+		state.dialogVisible = false;
+	}
+};
+// 打开弹窗
+const openDrawer = (id: string) => {
+	getOrderDetail(id);
+	state.dialogVisible = true;
+};
+// 关闭弹窗
+const closeDrawer = () => {
+	state.dialogVisible = false;
+};
+// 选择来源渠道
+const changeChannel = (val: any) => {
+	state.ruleForm.fromPhone = null;
+	state.ruleForm.sourceChannel = val?.dicDataName ?? null;
+	state.ruleForm.sourceChannelCode = val?.dicDataValue ?? null;
+	ruleFormRef.value.resetFields('fromPhone'); // 清除来电号码
+	const item = state.pushTypeOptions.find((item: any) => item.dicDataValue === '7'); // 110
+	if (['110', 'YB110'].includes(val?.dicDataValue)) {
+		// 如果来源渠道选择了110 推送分类联动选择110
+		state.ruleForm.orderPushTypes.push(item);
+	} else {
+		// 清除110选择
+		state.ruleForm.orderPushTypes = state.ruleForm.orderPushTypes.filter((item: any) => item.dicDataValue !== '7');
+	}
+};
+// 选择来点人身份如果是企业 推送分类自动选择助企纾困
+const selectIdentity = (val: number) => {
+	if (val === 2) {
+		const item = state.pushTypeOptions.find((item: any) => item.dicDataValue === '8'); // 助企纾困
+		// 如果已经选择了助企纾困就不添加
+		if (item) {
+			if (state.ruleForm.orderPushTypes.includes(item)) return;
+			state.ruleForm.orderPushTypes.push(item);
+		}
+	} else {
+		// 如果选择其他需要清除
+		state.ruleForm.orderPushTypes = state.ruleForm.orderPushTypes.filter((item: any) => item.dicDataValue !== '8');
+	}
+};
+// 填写来电人姓名时根据填写内容自动选择性别
+const inputName = (val: string) => {
+	if (val.includes('先生')) {
+		state.ruleForm.fromGender = 1;
+	} else if (val.includes('女士')) {
+		state.ruleForm.fromGender = 0;
+	}
+};
+// 选择证件类型
+const changeLicenceType = (val: any) => {
+	state.ruleForm.licenceType = val?.dicDataName ?? null;
+	state.ruleForm.licenceTypeCode = val?.dicDataValue ?? null;
+};
+// 选择受理类型
+const changeAcceptType = (val: any) => {
+	state.ruleForm.acceptType = val?.dicDataName ?? null;
+	state.ruleForm.acceptTypeCode = val?.dicDataValue ?? null;
+};
+// 选择工单标签
+const changeOrderTag = (val: any) => {
+	state.ruleForm.orderTag = val?.dicDataName ?? null;
+	state.ruleForm.orderTagCode = val?.dicDataValue ?? null;
+};
+// 选择事件分类
+const chooseEvent = (val: any, node: any, externalArr: any) => {
+	state.ruleForm.eventCategoryName = val?.eventName; // 事件分类名称
+	state.ruleForm.eventCategorySpliceName = val?.eventFullName; // 事件分类拼接名称
+	state.ruleForm.eventCategoryExternal = externalArr?.join(',') ?? ''; // 事件分类id
+};
+// 选择热点分类
+const knowledgeRef = ref<RefType>();
+const chooseHotSpot = (val: any, node: any, externalArr: any) => {
+	state.ruleForm.hotspotSpliceName = val?.hotSpotFullName; // 热点分类拼接名称
+	state.ruleForm.hotspotName = val?.hotSpotName; // 热点分类名称
+	state.ruleForm.hotspotCode = val?.provinceCode; // 热点分类code
+	state.ruleForm.hotspotExternal = externalArr?.join(',') ?? ''; // 热点分类默认展开项
+	knowledgeRef.value.querySearch(state.ruleForm.hotspotName);
+};
+// 获取事发地址
+const areaRef = ref<RefType>();
+const changeArea = () => {
+	const currentNode = areaRef.value.getCheckedNodes();
+	// 判断数组长度
+	if (currentNode[0].pathLabels.length <= 4) {
+		state.ruleForm.city = currentNode[0].pathLabels[0] ?? ''; // 市
+		state.ruleForm.county = currentNode[0].pathLabels[1] ?? ''; // 区
+		state.ruleForm.town = currentNode[0].pathLabels[2] ?? ''; // 地区
+	} else {
+		// 如果数组长度大于4
+		state.ruleForm.city = currentNode[0].pathLabels[0] ?? ''; // 市
+		state.ruleForm.county = currentNode[0].pathLabels[1] ?? ''; // 区
+		state.ruleForm.town = currentNode[0].pathLabels[2] ?? ''; // 地区
+		state.ruleForm.areaText = currentNode[0].pathLabels.slice(3).join('') ?? ''; // 地区
+		console.log(state.ruleForm.areaText);
+	}
+};
+// 打开拓展表单
+const ExpandFormRef = ref<RefType>();
+const showExpandForm = () => {
+	ExpandFormRef.value.openDialog();
+};
+// 拓展表单保存
+const saveExpandForm = (val: any) => {
+	state.ruleForm.orderExtension = val;
+};
+// 选择重点关注事项
+const changeFocusEvent = (val: string[]) => {
+	state.ruleForm.isUrgent = val.includes('0'); // 是否紧急工单
+	state.ruleForm.isFormalistWorkOrder = val.includes('1'); // 是否形式主义工单
+	state.ruleForm.isSensitiveWorkOrders = val.includes('3'); // 是否敏感类工单
+	state.ruleForm.isEnforcementOrder = val.includes('2'); // 是否行政执法类工单
+	state.ruleForm.is24HoursComplete = val.includes('4'); // 24小时紧急工单
+	state.ruleForm.acceptSms = val.includes('5'); // 受理短信
+	state.ruleForm.isThreePartyConference = val.includes('6'); // 三方通话
+	state.ruleForm.focusOnEvents = val.join(',');
+	console.log(
+		`是否紧急工单:${val.includes('0')},是否行政执法类类工单:${val.includes('2')},是否形式主义工单:${val.includes('1')},是否敏感类工单:${val.includes(
+			'3'
+		)},是否24小时紧急工单:${val.includes('4')},是否受理短信:${val.includes('5')},是否三方通话:${val.includes('6')}`
+	);
+};
+// 选择企业
+const companySearchRef = ref<RefType>();
+const handleSelect = () => {
+	companySearchRef.value.openDialog();
+};
+// 选择企业
+const selectCompany = (row: any) => {
+	state.ruleForm.enterpriseName = row.enterpriseName;
+	state.ruleForm.enterpriseCode = row.enterpriseCode;
+	state.ruleForm.zhuanBanMingCheng = row.specialTeamName;
+	state.ruleForm.zhuanBanCode = row.specialTeamCode;
+};
+// 根据热点和事发地址去查询重复性事件 是否展示重复性事件
+const repeatEventRef = ref<RefType>();
+const showRepeatEvent = ref<boolean>(false);
+const stopWatch = watch([() => state.ruleForm.hotspotSpliceName, () => state.ruleForm.address], (value) => {
+	if (value[0] && value[1]) {
+		orderRepeatEvent({ hotspotSpliceName: value[0], address: value[1] }).then((res: any) => {
+			if (res.result) {
+				showRepeatEvent.value = true;
+				repeatEventRef.value.queryList();
+			} else {
+				showRepeatEvent.value = false;
+			}
+		});
+	} else {
+		showRepeatEvent.value = false;
+	}
+});
+stopWatch();
+// 选择是否重复
+const isRepeatChange = (val: string) => {
+	if (val === 'false') clearRepeat();
+};
+// 清除重复件
+const clearRepeat = () => {
+	ElMessageBox.confirm(`确认要清除选择的重复工单?`, '提示', {
+		confirmButtonText: '确认',
+		cancelButtonText: '取消',
+		type: 'warning',
+		draggable: true,
+		cancelButtonClass: 'default-button',
+		autofocus: false,
+	})
+		.then(() => {
+			orderRepeatSelectRef.value.clearSelection();
+			setTimeout(() => {
+				state.ruleForm.duplicateTitle = null;
+				state.ruleForm.duplicateIds = [];
+			}, 0);
+		})
+		.catch(() => {
+			state.ruleForm.isRepeat = 'true';
+		});
+};
+// 选择重复件
+const orderRepeatSelectRef = ref<RefType>();
+const selectRepeat = () => {
+	orderRepeatSelectRef.value.openDialog(state.ruleForm);
+};
+// 确定选择重复工单
+const orderRepeatSuccess = (row: any) => {
+	state.ruleForm.duplicateIds = row.map((item: any) => item.id);
+	state.ruleForm.duplicateTitle = '已选择';
+	orderRepeatSelectRef.value.closeDialog();
+};
+// 选择是否市州互转
+const changeTransPond = (val: any) => {
+	if (!val) {
+		ElMessageBox.confirm(`确认要清除选择的互转市州?`, '提示', {
+			confirmButtonText: '确认',
+			cancelButtonText: '取消',
+			type: 'warning',
+			draggable: true,
+			cancelButtonClass: 'default-button',
+			autofocus: false,
+		})
+			.then(() => {
+				setTimeout(() => {
+					state.ruleForm.transpondCityValue = null;
+					state.ruleForm.transpondCityName = null;
+					state.ruleForm.transpondCityId = null;
+					state.ruleForm.transpondCityObj = null;
+				}, 0);
+			})
+			.catch(() => {
+				state.ruleForm.transpond = true;
+			});
+	}
+};
+// 选择市州互转
+const changeTranspondCity = (val: any) => {
+	state.ruleForm.transpondCityId = val?.id ?? null;
+	state.ruleForm.transpondCityValue = val?.dicDataValue ?? null;
+	state.ruleForm.transpondCityName = val?.dicDataName ?? null;
+};
+// 填写标题时根据填写内容自动选择受理类型
+const inputTitle = (val: string) => {
+	if (!state.ruleForm.acceptType) {
+		const item = state.acceptTypeOptions.find((item: any) => item.dicDataName === val);
+		if (item) {
+			state.ruleForm.acceptTypeObj = item;
+			state.ruleForm.acceptType = item.dicDataName;
+			state.ruleForm.acceptTypeCode = item.dicDataValue;
+		}
+	}
+};
+// 选中常用意见
+const chooseAdvice = (item: any) => {
+	state.ruleForm.content += item.content;
+};
+// 查看录音文件 播放录音
+const playRecordRef = ref<RefType>();
+const recordFile = (obj: any) => {
+	playRecordRef.value.openDialog(obj.callId);
+};
+// 将当前工单添加到重复性事件中
+const repeatableEventDetails = ref<EmptyArrayType>([]);
+// 删除不必要的属性
+const deleteUnnecessaryProperties = (obj: any) => {
+	const propertiesToDelete = ['ageRangeObj', 'licenceTypeObj', 'channel', 'acceptTypeObj', 'transpondCity', 'orderTagObj'];
+	propertiesToDelete.forEach((prop) => Reflect.deleteProperty(obj, prop));
+};
+// 是否打开拓展表单
+const shouldOpenDialog = (obj: any) =>
+	!ExpandFormRef.value.state.validated &&
+	obj.orderExtension &&
+	obj.orderExtension.orderTypeCode &&
+	['scjgjts,scjgjjb'].includes(obj.orderExtension.orderTypeCode);
+// 保存
+const ruleFormRef = ref<RefType>();
+const emit = defineEmits(['updateList']);
+const save = (formEl: FormInstance | undefined) => {
+	if (!formEl) return;
+	formEl.validate((valid: boolean) => {
+		if (!valid) return;
+		state.loading = true;
+		let orderDetail = {
+			...state.ruleForm,
+			repeatableEventDetails: repeatableEventDetails.value,
+			isEdit: true,
+		};
+		deleteUnnecessaryProperties(orderDetail);
+		const addOrderAndNavigate = () => {
+			orderEdit(orderDetail)
+				.then(() => {
+					state.loading = false;
+					emit('updateList');
+					closeDrawer();
+					ElMessage.success('保存成功');
+				})
+				.catch(() => {
+					state.loading = false;
+				});
+		};
+		if (shouldOpenDialog(orderDetail)) {
+			ExpandFormRef.value.openDialog(true);
+		} else {
+			addOrderAndNavigate();
+		}
+	});
+};
+// 加载基础数据
+const loadBaseData = async () => {
+	try {
+		const { result } = await orderBaseDataAdd();
+		state.acceptTypeOptions = result?.acceptTypeOptions ?? [];
+		state.channelOptions = result?.channelOptions ?? [];
+		state.genderOptions = result?.genderOptions ?? [];
+		state.identityTypeOptions = result?.identityTypeOptions ?? [];
+		orderTypeOptions.value = result?.orderTypeOptions ?? [];
+		state.pushTypeOptions = result?.pushTypeOptions ?? [];
+		state.licenceTypeOptions = result?.licenceTypeOptions ?? [];
+		state.transpondCity = result?.transpondCity ?? [];
+		state.focusOnEvents = result?.focusOnEvents ?? [];
+		state.orderTags = result?.orderTags ?? [];
+		state.pushTypeOptions = state.pushTypeOptions.map((item: any) => {
+			return {
+				...item,
+				pushTypeCode: item.dicDataValue,
+				pushType: item.dicDataName,
+			};
+		});
+	} catch (error) {
+		console.log(error);
+	}
+};
+// 加载省市区
+const addressLoading = ref<boolean>(false);
+const loadAddress = async () => {
+	addressLoading.value = true;
+	try {
+		const area = await treeArea();
+		state.areaOptions = area.result ?? []; //省市区数据
+		addressLoading.value = false;
+	} catch (error) {
+		console.log(error);
+	} finally {
+		addressLoading.value = false;
+	}
+};
+// 加载扩展信息
+const orderTypeOptions = ref<EmptyObjectType>([]); // 工单类型
+// 拓展信息
+const extra = ref<any>({
+	ext: {},
+	area: {},
+	orderTypeOptions: [],
+});
+const extraLoading = ref<boolean>(false);
+const loadExtra = async () => {
+	extraLoading.value = true;
+	try {
+		const ext = await orderBaseExt(); // 扩展信息
+		extra.value = { ext: { ...ext.result, orderTypeOptions: orderTypeOptions.value, area: state.areaOptions } }; //补充信息
+	} catch (error) {
+		console.log(error);
+	} finally {
+		extraLoading.value = false;
+	}
+};
+// 外部输入数据没有受理名称和热点名称  赋值名称
+const getCurrentData = (val: any) => {
+	if (state.ruleForm.id || state.ruleForm.no) {
+		if (!state.ruleForm.hotspotName || !state.ruleForm.hotspotSpliceName) {
+			state.ruleForm.hotspotName = val?.data?.hotSpotName;
+			state.ruleForm.hotspotSpliceName = val?.data?.hotSpotFullName;
+			state.ruleForm.hotspotCode = val?.data?.provinceCode;
+		}
+	}
+};
+onMounted(() => {
+	loadBaseData();
+	loadAddress();
+	loadExtra();
+});
+defineExpose({
+	openDrawer,
+	closeDrawer,
+});
+</script>

+ 220 - 39
src/views/todo/edit/components/Edit-record.vue

@@ -1,18 +1,198 @@
 <template>
-	<el-drawer v-model="state.dialogVisible" title="明细信息" destroy-on-close size="500px" append-to-body>
-		<el-form label-width="110px" ref="ruleFormRef" :model="state.ruleForm" class="show-info-form" v-loading="state.loading">
-			<p class="border-title mb10">申请信息</p>
-			<el-form-item label="申请人"> {{ state.ruleForm.applyUserName }} </el-form-item>
-			<el-form-item label="申请部门"> {{ state.ruleForm.applyOrgName }} </el-form-item>
-			<el-form-item label="申请时间"> {{ formatDate(state.ruleForm.applyTime, 'YYYY-mm-dd HH:MM:SS') }} </el-form-item>
-			<el-form-item label="申请时限" v-if="currentType === 'delay'"> {{ state.ruleForm.applyDelayNum }} </el-form-item>
-			<el-form-item label="申请原因" class="formatted-text"> {{ state.ruleForm.applyReason }} </el-form-item>
-			<p class="border-title mb10 mt20">审核信息</p>
-			<el-form-item label="审核人">{{ state.ruleForm.auditName }}</el-form-item>
-			<el-form-item label="审核部门">{{ state.ruleForm.auditOrgName }}</el-form-item>
-			<el-form-item label="审核时间"> {{ formatDate(state.ruleForm.auditTime, 'YYYY-mm-dd HH:MM:SS') }} </el-form-item>
-			<el-form-item label="审核状态">{{ state.ruleForm.auditState }}</el-form-item>
-			<el-form-item label="审核原因" class="formatted-text">{{ state.ruleForm.auditContent }}</el-form-item>
+	<el-drawer v-model="state.dialogVisible" title="明细信息" destroy-on-close size="50%" append-to-body>
+		<el-form label-width="110px" ref="ruleFormRef" :model="oldInfo" class="show-info-form" v-loading="state.loading">
+			<el-row>
+				<el-col><p class="border-title mb10">修改前</p></el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="来源渠道">
+						{{ oldInfo.sourceChannel }}
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="受理人">
+						{{ oldInfo.acceptType }}
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="工单编码">
+						{{ oldInfo.no }}
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="来电主体">
+						{{ oldInfo.identityTypeText }}
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="联系电话">
+						{{ oldInfo.contact }}
+					</el-form-item>
+				</el-col>
+				<template v-if="['YiBin'].includes(themeConfig.appScope)">
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="oldInfo.licenceType">
+						<el-form-item label="证件类型">
+							{{ oldInfo.licenceType }}
+						</el-form-item>
+					</el-col>
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="oldInfo.licenceNo">
+						<el-form-item label="证件号码">
+							{{ oldInfo.licenceNo }}
+						</el-form-item>
+					</el-col>
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="oldInfo.enterpriseName">
+						<el-form-item label="企业名称">
+							{{ oldInfo.enterpriseName }}
+						</el-form-item>
+					</el-col>
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="oldInfo.zhuanBanMingCheng">
+						<el-form-item label="专班名称">
+							{{ oldInfo.zhuanBanMingCheng }}
+						</el-form-item>
+					</el-col>
+				</template>
+				<template v-if="['ZiGong', 'LuZhou'].includes(themeConfig.appScope)">
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="oldInfo.orderTag">
+						<el-form-item label="工单标签">
+							{{ oldInfo.orderTag }}
+						</el-form-item>
+					</el-col>
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+						<el-form-item label="重点标签">
+							{{ oldInfo.orderTag }}
+						</el-form-item>
+					</el-col>
+				</template>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="热点分类">
+						{{ oldInfo.hotspotSpliceName }}
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="oldInfo.fullAddress">
+					<el-form-item label="事发地址">
+						{{ oldInfo.fullAddress }}
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+					<el-form-item label="工单标题">
+						{{ oldInfo.title }}
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+					<el-form-item label="受理内容">
+						<div v-html="showKeyWord(oldInfo.content, oldInfo.sensitive)" class="formatted-text"></div>
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" v-if="oldInfo.centerOpinion">
+					<el-form-item label="中心意见">
+						<div class="formatted-text">{{ oldInfo.centerOpinion }}</div>
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" v-if="oldInfo.centerOpinion">
+					<el-form-item label="承办意见">
+						<div class="formatted-text">{{ oldInfo.fileOpinion }}</div>
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" v-if="oldInfo.sendBackOpinion">
+					<el-form-item label="退回意见">
+						<div class="formatted-text">{{ oldInfo.sendBackOpinion }}</div>
+					</el-form-item>
+				</el-col>
+				<el-col><p class="border-title mb10 mt20">修改后</p></el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="来源渠道">
+						{{ newInfo.sourceChannel }}
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="受理人">
+						{{ newInfo.acceptType }}
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="工单编码">
+						{{ newInfo.no }}
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="来电主体">
+						{{ newInfo.identityTypeText }}
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="联系电话">
+						{{ newInfo.contact }}
+					</el-form-item>
+				</el-col>
+				<template v-if="['YiBin'].includes(themeConfig.appScope)">
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="newInfo.licenceType">
+						<el-form-item label="证件类型">
+							{{ newInfo.licenceType }}
+						</el-form-item>
+					</el-col>
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="newInfo.licenceNo">
+						<el-form-item label="证件号码">
+							{{ newInfo.licenceNo }}
+						</el-form-item>
+					</el-col>
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="newInfo.enterpriseName">
+						<el-form-item label="企业名称">
+							{{ newInfo.enterpriseName }}
+						</el-form-item>
+					</el-col>
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="newInfo.zhuanBanMingCheng">
+						<el-form-item label="专班名称">
+							{{ newInfo.zhuanBanMingCheng }}
+						</el-form-item>
+					</el-col>
+				</template>
+				<template v-if="['ZiGong', 'LuZhou'].includes(themeConfig.appScope)">
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="newInfo.orderTag">
+						<el-form-item label="工单标签">
+							{{ newInfo.orderTag }}
+						</el-form-item>
+					</el-col>
+					<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+						<el-form-item label="重点标签">
+							{{ newInfo.orderTag }}
+						</el-form-item>
+					</el-col>
+				</template>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+					<el-form-item label="热点分类">
+						{{ newInfo.hotspotSpliceName }}
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" v-if="newInfo.fullAddress">
+					<el-form-item label="事发地址">
+						{{ newInfo.fullAddress }}
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+					<el-form-item label="工单标题">
+						{{ newInfo.title }}
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+					<el-form-item label="受理内容">
+						<div v-html="showKeyWord(newInfo.content, newInfo.sensitive)" class="formatted-text"></div>
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" v-if="newInfo.centerOpinion">
+					<el-form-item label="中心意见">
+						<div class="formatted-text">{{ newInfo.centerOpinion }}</div>
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" v-if="newInfo.centerOpinion">
+					<el-form-item label="承办意见">
+						<div class="formatted-text">{{ newInfo.fileOpinion }}</div>
+					</el-form-item>
+				</el-col>
+				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" v-if="newInfo.sendBackOpinion">
+					<el-form-item label="退回意见">
+						<div class="formatted-text">{{ newInfo.sendBackOpinion }}</div>
+					</el-form-item>
+				</el-col>
+			</el-row>
 		</el-form>
 		<template #footer>
 			<span class="dialog-footer">
@@ -23,48 +203,49 @@
 </template>
 <script setup lang="ts" name="businessUrgeDetailDialog">
 import { reactive, ref } from 'vue';
-import { formatDate } from '@/utils/formatTime';
-import { provinceDelayDetail, provinceIdentifyDetail, provinceReturnDetail } from '@/api/province';
+import { getOrderModifyRecordDetail } from '@/api/todo/center';
+import { useThemeConfig } from '@/stores/themeConfig';
+import { storeToRefs } from 'pinia';
 
 // 定义子组件向父组件传值/事件
 // 定义变量内容
 const state = reactive<any>({
 	dialogVisible: false, // 是否显示弹窗
 	loading: false, // 是否显示加载
-	ruleForm: {},
 });
+const storesThemeConfig = useThemeConfig();
+const { themeConfig } = storeToRefs(storesThemeConfig);
 // 打开弹窗
-const currentType = ref('');
-const openDrawer = async (id: string, type: string) => {
+const newInfo = ref<EmptyObjectType>({});
+const oldInfo = ref<EmptyObjectType>({});
+const openDrawer = async (id: string) => {
 	state.loading = true;
 	state.dialogVisible = true;
-	currentType.value = type;
 	try {
-		switch (type) {
-			case 'delay':
-				const { result } = await provinceDelayDetail({ id });
-				state.ruleForm = result;
-				state.loading = false;
-				break;
-			case 'return':
-				const returnRes = await provinceReturnDetail({ id });
-				state.ruleForm = returnRes.result;
-				state.loading = false;
-				break;
-			case 'screen':
-				const screenRes = await provinceIdentifyDetail({ id });
-				state.ruleForm = screenRes.result;
-				state.loading = false;
-				break;
-			default:
-				break;
-		}
+		const { result } = await getOrderModifyRecordDetail(id);
+		newInfo.value = result.newInfo;
+		oldInfo.value = result.oldInfo;
+		state.loading = false;
 	} catch (e) {
 		console.log(e);
 		state.loading = false;
 		state.dialogVisible = false;
 	}
 };
+// 高亮关键词
+const showKeyWord = (val: string[], keywordArr: string[]) => {
+	let str: any = val;
+	if (keywordArr && keywordArr.length) {
+		// 2.定制关键词对应正则
+		keywordArr.forEach((e) => {
+			let regStr = '' + `(${e})`;
+			let reg = new RegExp(regStr, 'g');
+			// 3.正则替换,关键词飘红
+			str = str.replace(reg, '<span class="color-danger font-bold"">' + e + '</span>');
+		});
+	}
+	return str;
+};
 // 关闭弹窗
 const closeDrawer = () => {
 	state.dialogVisible = false;

+ 5 - 8
src/views/todo/edit/index.vue

@@ -223,12 +223,13 @@
 				<el-button @click="resetQuery(drawerRuleFormRef)" class="default-button"> <SvgIcon name="ele-Refresh" class="mr5" />重置 </el-button>
 			</template>
 		</el-drawer>
+		<!--	修改工单	-->
+		<EditOrder ref="editOrderRef" @updateList="handleQuery"/>
 	</div>
 </template>
 <script setup lang="tsx" name="todoEdit">
 import { defineAsyncComponent, onMounted, reactive, ref, onActivated, onBeforeUnmount } from 'vue';
 import type { FormInstance } from 'element-plus';
-import { ElMessage, ElMessageBox } from 'element-plus';
 import { defaultTimeStartEnd, shortcuts } from '@/utils/constants';
 import { formatDate } from '@/utils/formatTime';
 import { exportOrder, listBaseData, orderListCount, orderListFixed } from '@/api/business/order';
@@ -240,6 +241,7 @@ import { useRouter } from 'vue-router';
 
 // 引入组件
 const OrderDetail = defineAsyncComponent(() => import('@/components/OrderDetail/index.vue')); // 工单详情
+const EditOrder = defineAsyncComponent(() => import('@/views/todo/edit/components/Edit-order.vue')); // 工单修改
 
 // 定义变量内容
 const state = reactive<any>({
@@ -482,14 +484,9 @@ const onRecord = () => {
 	})
 };
 // 编辑工单
+const editOrderRef = ref();
 const onOrderEdit = (row: any) => {
-	router.push({
-		name: 'orderAccept',
-		query: {
-			id: row.id,
-			tagsViewName: `编辑工单-${row.title}`,
-		},
-	});
+	editOrderRef.value.openDrawer(row.id);
 };
 onMounted(() => {
 	getBaseData();

+ 21 - 62
src/views/todo/edit/record.vue

@@ -13,18 +13,9 @@
 			>
 				<template #table-search>
 					<el-form :model="state.queryParams" ref="ruleFormRef" @submit.native.prevent inline>
-						<el-form-item label="工单标题" prop="Keyword">
-							<el-input v-model="state.queryParams.Keyword" placeholder="工单标题" clearable @keyup.enter="handleQuery" class="keyword-input" />
+						<el-form-item label="工单编码" prop="Keyword">
+							<el-input v-model="state.queryParams.Keyword" placeholder="工单编码" clearable @keyup.enter="handleQuery" class="keyword-input" />
 						</el-form-item>
-						<el-form-item label="工单编码" prop="No">
-							<el-input v-model="state.queryParams.No" placeholder="工单编码" clearable @keyup.enter="handleQuery" class="keyword-input" />
-						</el-form-item>
-						<!--				<el-form-item label="处理结果" prop="Resolve">
-							<el-select v-model="state.queryParams.Resolve" placeholder="请选择处理结果" @change="handleQuery">
-								<el-option label="已得到解决" value="true" />
-								<el-option label="未得到解决" value="false" />
-							</el-select>
-						</el-form-item>-->
 						<el-form-item>
 							<el-button type="primary" @click="handleQuery" :loading="state.loading"> <SvgIcon name="ele-Search" class="mr5" />查询 </el-button>
 							<el-button @click="resetQuery(ruleFormRef)" class="default-button" :loading="state.loading">
@@ -34,10 +25,10 @@
 					</el-form>
 				</template>
 				<template #title="{ row }">
-					<order-detail :order="row.order" @updateList="queryList">{{ row.order?.title }}</order-detail>
+					<order-detail :order="row" @updateList="queryList">{{ row.title }}</order-detail>
 				</template>
-				<template #publishState="{ row }">
-					<span>{{ row.publishState ? '公开' : '不公开' }}</span>
+				<template #expiredStatusText="{ row }">
+					<span :class="'overdue-status-' + row.expiredStatus" :title="row.expiredStatusText"></span>
 				</template>
 				<!-- 表格操作 -->
 				<template #operation="{ row }">
@@ -47,10 +38,7 @@
 				</template>
 			</ProTable>
 		</div>
-		<!-- 工单发布详情 -->
-		<order-publish ref="orderPublishRef" @updateList="queryList" />
-		<!-- 工单发布修改 -->
-		<order-publish-edit ref="orderPublishEditRef" @updateList="queryList" />
+		<edit-record ref="orderPublishEditRef" />
 	</div>
 </template>
 <script setup lang="tsx" name="todoEditRecord">
@@ -58,59 +46,30 @@ import { defineAsyncComponent, onMounted, reactive, ref } from 'vue';
 import { FormInstance } from 'element-plus';
 import { formatDate } from '@/utils/formatTime';
 import { publishedList } from '@/api/business/publish';
+import { getOrderModifyRecord } from '@/api/todo/center';
 // 引入组件
-const OrderPublish = defineAsyncComponent(() => import('@/views/business/publish/components/Order-publish.vue')); // 工单发布和查看详情
-const OrderPublishEdit = defineAsyncComponent(() => import('@/views/business/publish/components/Order-publish-edit.vue')); // 工单发布修改
+const EditRecord = defineAsyncComponent(() => import('@/views/todo/edit/components/Edit-record.vue')); // 修改记录详情
 const OrderDetail = defineAsyncComponent(() => import('@/components/OrderDetail/index.vue')); // 工单详情
 // 定义变量内容
 const ruleFormRef = ref<RefType>(); // 表单ref
 const proTableRef = ref<RefType>(); // 表格ref
 // 表格配置项
 const columns = ref<any[]>([
-	{ prop: 'order.no', label: '工单编码', minWidth: 140 },
-	{ prop: 'order.isProvinceText', label: '省/市工单', minWidth: 90 },
-	{ prop: 'order.title', label: '工单标题', minWidth: 200 },
-	{ prop: 'order.counterSignTypeText', label: '是否会签', minWidth: 90 },
-	{ prop: 'order.sourceChannel', label: '来源渠道', minWidth: 100 },
-	{ prop: 'order.statusText', label: '工单状态', minWidth: 100 },
-	{ prop: 'order.acceptType', label: '受理类型', minWidth: 100 },
-	{ prop: 'order.hotspotName', label: '热点分类', minWidth: 150 },
-	{ prop: 'order.acceptorName', label: '受理人', minWidth: 120 },
-	{ prop: 'order.actualHandleOrgName', label: '接办部门', minWidth: 140 },
-	{
-		prop: 'publishTime',
-		label: '发布时间',
-		minWidth: 160,
-		render: (scope) => {
-			return <span>{formatDate(scope.row.publishTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
-		},
-	},
-	{
-		prop: 'order.filedTime',
-		label: '办结时间',
-		minWidth: 160,
-		render: (scope) => {
-			return <span>{formatDate(scope.row.order?.filedTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
-		},
-	},
-	{ prop: 'publishMan', label: '发布人', minWidth: 120 },
-	{
-		prop: 'order.startTime',
-		label: '受理时间',
-		minWidth: 160,
-		render: (scope) => {
-			return <span>{formatDate(scope.row.order?.startTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
-		},
-	},
+	{ prop: 'expiredStatusText', label: '超期状态', align: 'center', minWidth: 80 },
+	{ prop: 'statusText', label: '工单状态', minWidth: 100 },
+	{ prop: 'sourceChannel', label: '来源渠道', minWidth: 100 },
+	{ prop: 'currentStepName', label: '当前节点', minWidth: 100 },
+	{ prop: 'no', label: '工单编码', minWidth: 140 },
+	{ prop: 'title', label: '工单标题', minWidth: 200 },
+	{ prop: 'auditUserName', label: '修改人', minWidth: 90 },
 	{
-		prop: 'lastModificationTime',
-		label: '更新时间',
+		prop: 'creationTime',
+		label: '修改时间',
 		minWidth: 160,
 		render: (scope) => {
-			return <span>{formatDate(scope.row.lastModificationTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
+			return <span>{formatDate(scope.row.creationTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
 		},
 	},
-	{ prop: 'publishState', label: '是否公开' },
 	{ prop: 'operation', label: '操作', fixed: 'right', minWidth: 90, align: 'center' },
 ]);
 const state = reactive({
@@ -134,7 +93,7 @@ const handleQuery = () => {
 /** 获取列表 */
 const queryList = () => {
 	state.loading = true;
-	publishedList(state.queryParams)
+	getOrderModifyRecord(state.queryParams)
 		.then((res: any) => {
 			state.tableData = res.result?.items ?? [];
 			state.total = res.result?.total ?? 0;
@@ -151,9 +110,9 @@ const resetQuery = (formEl: FormInstance | undefined) => {
 	queryList();
 };
 // 查看明细
-const orderPublishEditRef = ref<RefType>(); // 工单发布修改ref
+const orderPublishEditRef = ref<RefType>();
 const onDetail = (row: any) => {
-	orderPublishEditRef.value.openDialog(row);
+	orderPublishEditRef.value.openDrawer(row.copyId);
 };
 onMounted(() => {
 	queryList();