From c65b90aaa3477a90ebc325024927d80227c0c841 Mon Sep 17 00:00:00 2001
From: WXL (wul) <wl_5969728@163.com>
Date: 星期四, 09 四月 2026 14:09:25 +0800
Subject: [PATCH] 测试完成

---
 src/views/Satisfaction/configurationmyd/components/DetailsAnomaly.vue | 1177 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 1,177 insertions(+), 0 deletions(-)

diff --git a/src/views/Satisfaction/configurationmyd/components/DetailsAnomaly.vue b/src/views/Satisfaction/configurationmyd/components/DetailsAnomaly.vue
index e69de29..1219d47 100644
--- a/src/views/Satisfaction/configurationmyd/components/DetailsAnomaly.vue
+++ b/src/views/Satisfaction/configurationmyd/components/DetailsAnomaly.vue
@@ -0,0 +1,1177 @@
+<template>
+  <el-dialog
+    :title="title"
+    :visible.sync="dialogVisible"
+    width="900px"
+    top="5vh"
+    class="exception-detail-dialog"
+    @close="handleClose"
+  >
+    <!-- 鍩烘湰淇℃伅 -->
+    <div class="info-section">
+      <div class="section-title">鍩烘湰淇℃伅</div>
+      <el-row :gutter="20">
+        <el-col :span="8">
+          <div class="info-item">
+            <span class="label">闂鍐呭锛�</span>
+            <span class="value">{{ currentRecord.questiontext || '鏃�' }}</span>
+          </div>
+        </el-col>
+        <el-col :span="8">
+          <div class="info-item">
+            <span class="label">鍥炵瓟鍐呭锛�</span>
+            <span class="value">{{ currentRecord.asrtext || '鏃犲洖绛�' }}</span>
+          </div>
+        </el-col>
+        <el-col :span="8">
+          <div class="info-item">
+            <span class="label">瑙f瀽鍊硷細</span>
+            <span class="value">{{ currentRecord.matchedtext || '鏃�' }}</span>
+          </div>
+        </el-col>
+        <el-col :span="8">
+          <div class="info-item">
+            <span class="label">璐熻矗绉戝锛�</span>
+            <el-tag v-if="currentRecord.todeptname" type="primary">{{ currentRecord.todeptname }}</el-tag>
+            <span v-else class="value">鏈垎閰�</span>
+          </div>
+        </el-col>
+        <el-col :span="8">
+          <div class="info-item">
+            <span class="label">澶勭悊鐘舵�侊細</span>
+            <el-tag
+              :type="getStatusTagType(currentRecord.handleFlag)"
+              effect="dark"
+            >
+              {{ getStatusText(currentRecord.handleFlag) }}
+            </el-tag>
+          </div>
+        </el-col>
+        <el-col :span="8">
+          <div class="info-item">
+            <span class="label">妯℃澘绫诲瀷锛�</span>
+            <el-tag :type="currentRecord.templateType === 1 ? 'primary' : 'success'">
+              {{ currentRecord.templateType === 1 ? '璇煶妯℃澘' : '闂嵎妯℃澘' }}
+            </el-tag>
+          </div>
+        </el-col>
+        <el-col :span="8">
+          <div class="info-item">
+            <span class="label">鍒涘缓鏃堕棿锛�</span>
+            <span class="value">{{ formatDateTime(currentRecord.createTime) }}</span>
+          </div>
+        </el-col>
+        <el-col :span="8">
+          <div class="info-item">
+            <span class="label">澶勭悊鏃堕棿锛�</span>
+            <span class="value">{{ currentRecord.handleTime ? formatDateTime(currentRecord.handleTime) : '鏈鐞�' }}</span>
+          </div>
+        </el-col>
+        <el-col :span="8">
+          <div class="info-item">
+            <span class="label">澶勭悊浜猴細</span>
+            <span class="value">{{ currentRecord.handleBy || '鏈鐞�' }}</span>
+          </div>
+        </el-col>
+        <el-col :span="8" v-if="currentRecord.handleresult">
+          <div class="info-item">
+            <span class="label">澶勭悊缁撴灉锛�</span>
+            <span class="value">{{ getHandleresultText(currentRecord.handleresult) }}</span>
+          </div>
+        </el-col>
+        <el-col :span="16" v-if="currentRecord.handledesc">
+          <div class="info-item">
+            <span class="label">澶勭悊璇存槑锛�</span>
+            <span class="value">{{ currentRecord.handledesc }}</span>
+          </div>
+        </el-col>
+        <el-col :span="24" v-if="currentRecord.finaloption">
+          <div class="info-item">
+            <span class="label">鏈�缁堟剰瑙侊細</span>
+            <span class="value">{{ currentRecord.finaloption }}</span>
+          </div>
+        </el-col>
+        <el-col :span="8" v-if="currentRecord.recordurl">
+          <div class="info-item">
+            <span class="label">褰曢煶鍦板潃锛�</span>
+            <el-button
+              type="text"
+              size="small"
+              icon="el-icon-headset"
+              @click="handlePlayAudio(currentRecord.recordurl)"
+            >
+              鎾斁褰曢煶
+            </el-button>
+          </div>
+        </el-col>
+        <el-col :span="8" v-if="currentRecord.ccdepts">
+          <div class="info-item">
+            <span class="label">鎶勯�佺瀹わ細</span>
+            <span class="value">{{ currentRecord.ccdepts }}</span>
+          </div>
+        </el-col>
+      </el-row>
+    </div>
+
+    <!-- 闂嵎/璇煶璇︽儏 -->
+    <div class="content-container" v-if="templateData.length > 0">
+      <el-tabs v-model="activeName" type="border-card">
+        <!-- 闂嵎闅忚璇︽儏 -->
+        <el-tab-pane name="wj" v-if="currentRecord.templateType === 2">
+          <span slot="label"><i class="el-icon-notebook-1"></i> 闂嵎闅忚璇︽儏</span>
+          <div class="CONTENT">
+            <div class="title">{{ currentRecord.questiontext || '闂嵎璇︽儏' }}</div>
+            <div class="preview-left" v-if="!isVoiceTemplate">
+              <div
+                class="topic-dev"
+                v-for="(item, index) in templateData"
+                :key="item.id"
+              >
+                <!-- 鍗曢�� -->
+                <div
+                  :class="getTopicClass(item)"
+                  :key="index"
+                  v-if="item.scriptType == 1 && !item.astrict"
+                >
+                  <div class="dev-text">
+                    {{ index + 1 }}銆乕鍗曢�塢<span>{{ item.scriptContent }}</span>
+                  </div>
+                  <div class="dev-xx">
+                    <el-radio-group v-model="item.scriptResult" disabled>
+                      <el-radio
+                        v-for="(option, optionIndex) in item.svyTaskTemplateTargetoptions"
+                        :class="getOptionClass(option)"
+                        :key="optionIndex"
+                        :label="option.optioncontent"
+                      >{{ option.optioncontent }}</el-radio>
+                    </el-radio-group>
+                  </div>
+                  <div
+                    v-if="item.showAppendInput || item.answerps"
+                    class="append-input-container"
+                  >
+                    <el-input
+                      type="textarea"
+                      :rows="2"
+                      placeholder="璇疯緭鍏ュ叿浣撲俊鎭�"
+                      v-model="item.answerps"
+                      readonly
+                    ></el-input>
+                  </div>
+                  <div v-show="item.prompt">
+                    <el-alert :title="item.prompt" type="warning"></el-alert>
+                  </div>
+                </div>
+                <!-- 澶氶�� -->
+                <div
+                  :class="item.isabnormal ? 'scriptTopic-isabnormal' : 'scriptTopic-dev'"
+                  :key="index"
+                  v-if="item.scriptType == 2 && !item.astrict"
+                >
+                  <div class="dev-text">
+                    {{ index + 1 }}銆乕澶氶�塢<span>{{ item.scriptContent }}</span>
+                  </div>
+                  <div class="dev-xx">
+                    <el-checkbox-group v-model="item.scriptResult" disabled>
+                      <el-checkbox
+                        :class="option.isabnormal ? 'red-star' : ''"
+                        v-for="(option, optionIndex) in item.svyTaskTemplateTargetoptions"
+                        :key="optionIndex"
+                        :label="option.optioncontent"
+                      >
+                        {{ option.optioncontent }}
+                      </el-checkbox>
+                    </el-checkbox-group>
+                  </div>
+                  <div v-show="item.prompt && item.scriptResult[0]">
+                    <el-alert :title="item.prompt" type="warning"></el-alert>
+                  </div>
+                </div>
+                <!-- 濉┖ -->
+                <div
+                  class="scriptTopic-dev"
+                  :key="index"
+                  v-if="item.scriptType == 4 && !item.astrict"
+                >
+                  <div class="dev-text">
+                    {{ index + 1 }}銆乕闂瓟]<span>{{ item.scriptContent }}</span>
+                    <span v-if="item.valueType == 3">(鍙兘杈撳叆鏁板瓧)</span>
+                  </div>
+                  <div class="dev-xx" v-if="item.valueType == 3">
+                    <el-input
+                      type="text"
+                      placeholder="璇疯緭鍏ョ瓟妗�"
+                      v-model="item.scriptResult"
+                      readonly
+                    ></el-input>
+                  </div>
+                  <div class="dev-xx" v-else>
+                    <el-input
+                      type="textarea"
+                      :rows="2"
+                      placeholder="璇疯緭鍏ョ瓟妗�"
+                      v-model="item.scriptResult"
+                      readonly
+                    ></el-input>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </el-tab-pane>
+
+        <!-- 璇煶闅忚璇︽儏 -->
+        <el-tab-pane name="yy" v-if="currentRecord.templateType === 1">
+          <span slot="label"><i class="el-icon-headset"></i> 璇煶闅忚璇︽儏</span>
+          <div class="borderdiv">
+            <div class="title">{{ taskName }}</div>
+            <div class="voice-audio" v-if="voiceAudioUrl">
+              瀹屾暣璇煶锛�
+              <audio-player
+                :audio-source="voiceAudioUrl"
+              ></audio-player>
+            </div>
+            <div class="preview-left" v-if="voiceData.length > 0">
+              <div v-for="(item, index) in voiceData" :key="index">
+                <div class="leftside">
+                  <i class="el-icon-phone-outline"></i>
+                  <span>{{ item.questiontext || '闂鍐呭' }}</span>
+                </div>
+                <div class="offside">
+                  <i class="el-icon-user"></i>
+                  <div class="offside-value">
+                    <el-input
+                      type="textarea"
+                      :autosize="{ minRows: 1 }"
+                      v-model="item.asrtext"
+                      readonly
+                    ></el-input>
+                    <div v-if="item.questionvoice">
+                      <audio-player
+                        :audio-source="item.questionvoice"
+                      ></audio-player>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </el-tab-pane>
+      </el-tabs>
+    </div>
+
+    <!-- 澶勭悊璁板綍 -->
+    <div class="process-section" v-if="processRecords.length > 0">
+      <div class="section-title">澶勭悊璁板綍</div>
+      <div class="process-timeline">
+        <el-timeline>
+          <el-timeline-item
+            v-for="(record, index) in processRecords"
+            :key="index"
+            :timestamp="formatDateTime(record.handleTime || record.createTime)"
+            placement="top"
+          >
+            <el-card>
+              <div class="process-item">
+                <div class="process-header">
+                  <span class="process-user">{{ record.handleBy || '绯荤粺' }}</span>
+                  <el-tag
+                    size="small"
+                    :type="getStatusTagType(record.handleFlag)"
+                  >
+                    {{ getStatusText(record.handleFlag) }}
+                  </el-tag>
+                </div>
+                <div class="process-content">
+                  <div v-if="record.ccdepts" class="process-depts">
+                    <span class="label">鎶勯�佺瀹わ細</span>
+                    <el-tag
+                      v-for="dept in getDeptArray(record.ccdepts)"
+                      :key="dept"
+                      size="small"
+                      type="info"
+                      class="dept-tag"
+                    >
+                      {{ dept }}
+                    </el-tag>
+                  </div>
+                  <div v-if="record.handleresult" class="process-remark">
+                    <span class="label">澶勭悊缁撴灉锛�</span>
+                    <span class="content">{{ getHandleresultText(record.handleresult) }}</span>
+                  </div>
+                  <div v-if="record.handledesc" class="process-remark">
+                    <span class="label">澶勭悊璇存槑锛�</span>
+                    <span class="content">{{ record.handledesc }}</span>
+                  </div>
+                  <div v-if="record.finaloption" class="process-remark">
+                    <span class="label">鏈�缁堟剰瑙侊細</span>
+                    <span class="content">{{ record.finaloption }}</span>
+                  </div>
+                </div>
+              </div>
+            </el-card>
+          </el-timeline-item>
+        </el-timeline>
+      </div>
+    </div>
+
+    <span slot="footer" class="dialog-footer">
+      <el-button
+        type="primary"
+        icon="el-icon-edit"
+        @click="handleProcess"
+        v-if="currentRecord.handleFlag !== '1'"
+      >
+        澶勭悊寮傚父
+      </el-button>
+      <el-button @click="dialogVisible = false">鍏抽棴</el-button>
+    </span>
+
+    <!-- 澶勭悊瀵硅瘽妗� -->
+    <el-dialog
+      title="澶勭悊寮傚父鍙嶉"
+      :visible.sync="processDialogVisible"
+      width="600px"
+      center
+      append-to-body
+    >
+      <el-form
+        :model="processForm"
+        :rules="processRules"
+        ref="processForm"
+        label-width="100px"
+        size="medium"
+      >
+        <el-form-item label="澶勭悊鐘舵��" prop="handleFlag">
+          <el-select
+            v-model="processForm.handleFlag"
+            placeholder="璇烽�夋嫨澶勭悊鐘舵��"
+            style="width: 100%"
+          >
+            <el-option label="宸插鐞�" :value="'1'" />
+            <el-option label="鍙栨秷澶勭悊" :value="'0'" />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="鎶勯�佺瀹�" prop="ccdepts">
+          <el-select
+            v-model="processForm.ccdepts"
+            placeholder="璇烽�夋嫨鎶勯�佺瀹�"
+            multiple
+            filterable
+            collapse-tags
+            style="width: 100%"
+            :disabled="processForm.handleFlag !== '1'"
+          >
+            <el-option
+              v-for="dept in deptList"
+              :key="dept.deptCode"
+              :label="dept.label"
+              :value="dept.deptCode"
+            />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="澶勭悊缁撴灉" prop="handleresult">
+          <el-select
+            v-model="processForm.handleresult"
+            placeholder="璇烽�夋嫨澶勭悊缁撴灉"
+            style="width: 100%"
+            :disabled="processForm.handleFlag !== '1'"
+          >
+            <el-option label="宸茶В鍐�" value="resolved" />
+            <el-option label="宸茶В閲�" value="explained" />
+            <el-option label="宸茶浆浜�" value="transferred" />
+            <el-option label="闇�鏀硅繘" value="improvement" />
+            <el-option label="宸查┏鍥�" value="rejected" />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="澶勭悊璇存槑" prop="handledesc">
+          <el-input
+            v-model="processForm.handledesc"
+            type="textarea"
+            :rows="4"
+            placeholder="璇疯緭鍏ュ鐞嗚鏄庯紙鏈�澶�500瀛楋級"
+            maxlength="500"
+            show-word-limit
+            :disabled="processForm.handleFlag !== '1'"
+          />
+        </el-form-item>
+
+        <el-form-item label="鏈�缁堟剰瑙�" prop="finaloption" v-if="hasQualityPermission">
+          <el-input
+            v-model="processForm.finaloption"
+            type="textarea"
+            :rows="3"
+            placeholder="璇疯緭鍏ユ渶缁堝鐞嗘剰瑙侊紙鏈�澶�300瀛楋級"
+            maxlength="300"
+            show-word-limit
+          />
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="processDialogVisible = false">鍙栨秷</el-button>
+        <el-button
+          type="primary"
+          @click="submitProcess"
+          :loading="processing"
+        >
+          鎻愪氦澶勭悊
+        </el-button>
+      </span>
+    </el-dialog>
+
+    <!-- 褰曢煶鎾斁鍣� -->
+    <audio
+      v-if="audioUrl"
+      :src="audioUrl"
+      ref="audioPlayer"
+      controls
+      style="display: none"
+    />
+  </el-dialog>
+</template>
+
+<script>
+import { traceedit } from "@/api/AiCentre/index";
+import { getsearchrResults, getPersonVoices, getTaskservelist } from "@/api/AiCentre/index";
+import { deptTreeSelect } from "@/api/system/user";
+import AudioPlayer from "@/components/AudioPlayer"; // 闇�瑕佸垱寤鸿繖涓煶棰戞挱鏀剧粍浠�
+
+export default {
+  name: 'ExceptionDetailDialog',
+  components: {
+    AudioPlayer
+  },
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    recordId: {
+      type: [Number, String],
+      default: null
+    },
+    recordData: {
+      type: Object,
+      default: () => ({})
+    },
+    title: {
+      type: String,
+      default: '寮傚父鍙嶉璇︽儏'
+    }
+  },
+  data() {
+    return {
+      // 褰撳墠璁板綍
+      currentRecord: {},
+
+      // 闂嵎/璇煶鏁版嵁
+      activeName: 'wj',
+      taskName: '',
+      templateData: [],
+      voiceData: [],
+      voiceAudioUrl: '',
+
+      // 澶勭悊璁板綍
+      processRecords: [],
+
+      // 绉戝鍒楄〃
+      deptList: [],
+
+      // 澶勭悊瀵硅瘽妗�
+      processDialogVisible: false,
+      processing: false,
+      processForm: {
+        handleFlag: '',
+        ccdepts: [],
+        handleresult: '',
+        handledesc: '',
+        finaloption: ''
+      },
+      processRules: {
+        handleFlag: [
+          { required: true, message: '璇烽�夋嫨澶勭悊鐘舵��', trigger: 'change' }
+        ],
+        handleresult: [
+          {
+            required: true,
+            message: '璇烽�夋嫨澶勭悊缁撴灉',
+            trigger: 'change',
+            validator: (rule, value, callback) => {
+              if (this.processForm.handleFlag === '1' && !value) {
+                callback(new Error('璇烽�夋嫨澶勭悊缁撴灉'));
+              } else {
+                callback();
+              }
+            }
+          }
+        ],
+        handledesc: [
+          {
+            required: true,
+            message: '璇疯緭鍏ュ鐞嗚鏄�',
+            trigger: 'blur',
+            validator: (rule, value, callback) => {
+              if (this.processForm.handleFlag === '1' && (!value || value.trim().length < 3)) {
+                callback(new Error('澶勭悊璇存槑鑷冲皯3涓瓧绗�'));
+              } else {
+                callback();
+              }
+            }
+          }
+        ]
+      },
+
+      // 闊抽鎾斁
+      audioUrl: '',
+
+      // 鍔犺浇鐘舵��
+      loading: false,
+
+      // 鏉冮檺鎺у埗
+      hasQualityPermission: false
+    };
+  },
+
+  computed: {
+    dialogVisible: {
+      get() {
+        return this.visible;
+      },
+      set(val) {
+        this.$emit('update:visible', val);
+      }
+    },
+
+    isVoiceTemplate() {
+      return this.currentRecord.templateType === 1;
+    }
+  },
+
+  watch: {
+    visible: {
+      immediate: true,
+      handler(val) {
+        if (val) {
+          this.loadData();
+        } else {
+          this.resetData();
+        }
+      }
+    },
+
+    recordData: {
+      immediate: true,
+      handler(val) {
+        if (val && Object.keys(val).length > 0) {
+          this.currentRecord = { ...val };
+        }
+      }
+    }
+  },
+
+  methods: {
+    // 鏍煎紡鍖栨棩鏈熸椂闂�
+    formatDateTime(dateTime) {
+      if (!dateTime) return '';
+      try {
+        const date = new Date(dateTime);
+        if (isNaN(date.getTime())) {
+          return dateTime;
+        }
+        return date.toLocaleDateString().replace(/\//g, '-') + ' ' +
+               date.toTimeString().split(' ')[0];
+      } catch (error) {
+        console.error('鏃ユ湡鏍煎紡鍖栭敊璇�:', error);
+        return dateTime;
+      }
+    },
+
+    // 妫�鏌ヨ川绠℃潈闄�
+    checkQualityPermission() {
+      const userRoles = this.$store.getters.roles || [];
+      return userRoles.includes('quality_manager') || userRoles.includes('admin');
+    },
+
+    // 鑾峰彇绉戝鍒楄〃
+    async getDeptOptions() {
+      try {
+        const res = await deptTreeSelect();
+        if (res.code == 200) {
+          this.deptList = this.flattenArray(res.data) || [];
+        }
+      } catch (error) {
+        console.error('鑾峰彇绉戝鍒楄〃澶辫触:', error);
+      }
+    },
+
+    // 灞曞钩鏁扮粍
+    flattenArray(multiArray) {
+      let result = [];
+
+      function flatten(element) {
+        if (element.children && element.children.length > 0) {
+          element.children.forEach((child) => flatten(child));
+        } else {
+          let item = JSON.parse(JSON.stringify(element));
+          result.push(item);
+        }
+      }
+
+      multiArray.forEach((element) => flatten(element));
+      return result;
+    },
+
+    // 鑾峰彇鐘舵�佹爣绛剧被鍨�
+    getStatusTagType(handleFlag) {
+      switch (handleFlag) {
+        case '0': return 'warning'; // 鏈鐞�
+        case '1': return 'success'; // 宸插鐞�
+        default: return 'info';
+      }
+    },
+
+    // 鑾峰彇鐘舵�佹枃鏈�
+    getStatusText(handleFlag) {
+      switch (handleFlag) {
+        case '0': return '鏈鐞�';
+        case '1': return '宸插鐞�';
+        default: return '鏈煡';
+      }
+    },
+
+    // 鑾峰彇澶勭悊缁撴灉鏂囨湰
+    getHandleresultText(handleresult) {
+      const map = {
+        'resolved': '宸茶В鍐�',
+        'explained': '宸茶В閲�',
+        'transferred': '宸茶浆浜�',
+        'improvement': '闇�鏀硅繘',
+        'rejected': '宸查┏鍥�'
+      };
+      return map[handleresult] || handleresult;
+    },
+
+    // 鑾峰彇绉戝鏁扮粍
+    getDeptArray(ccdepts) {
+      if (!ccdepts) return [];
+      return ccdepts.split(',');
+    },
+
+    // 鎾斁闊抽
+    handlePlayAudio(url) {
+      this.audioUrl = url;
+      this.$nextTick(() => {
+        const audioPlayer = this.$refs.audioPlayer;
+        if (audioPlayer) {
+          audioPlayer.play().catch(error => {
+            console.error('鎾斁澶辫触:', error);
+            this.$message.error('闊抽鎾斁澶辫触');
+          });
+        }
+      });
+    },
+
+    // 鑾峰彇涓婚鏍峰紡绫�
+    getTopicClass(item) {
+      if (item.isabnormal == 1) {
+        return "scriptTopic-isabnormal";
+      } else if (item.isabnormal == 2) {
+        return "scriptTopic-warning";
+      } else {
+        return "scriptTopic-dev";
+      }
+    },
+
+    // 鑾峰彇閫夐」鏍峰紡绫�
+    getOptionClass(items) {
+      if (items.isabnormal == 1) {
+        return "red-star";
+      } else if (items.isabnormal == 2) {
+        return "yellow-star";
+      }
+      return "";
+    },
+
+    // 鍔犺浇鏁版嵁
+    async loadData() {
+      this.loading = true;
+      try {
+        this.hasQualityPermission = this.checkQualityPermission();
+        await this.getDeptOptions();
+
+        if (Object.keys(this.currentRecord).length === 0) {
+          this.currentRecord = this.recordData || {};
+        }
+
+        // 濡傛灉褰撳墠璁板綍鏄闊虫ā鏉匡紝鍔犺浇璇煶鏁版嵁
+        if (this.currentRecord.templateType === 1) {
+          await this.loadVoiceData();
+          this.activeName = 'yy';
+        } else if (this.currentRecord.templateType === 2) {
+          await this.loadQuestionnaireData();
+          this.activeName = 'wj';
+        }
+
+        await this.loadProcessRecords();
+      } catch (error) {
+        console.error('鍔犺浇璇︽儏鏁版嵁澶辫触:', error);
+        this.$message.error('鍔犺浇鏁版嵁澶辫触');
+      } finally {
+        this.loading = false;
+      }
+    },
+
+    // 閲嶇疆鏁版嵁
+    resetData() {
+      this.currentRecord = {};
+      this.templateData = [];
+      this.voiceData = [];
+      this.processRecords = [];
+      this.voiceAudioUrl = '';
+      this.taskName = '';
+      this.activeName = 'wj';
+    },
+
+    // 鍔犺浇闂嵎鏁版嵁
+    async loadQuestionnaireData() {
+      try {
+        // 杩欓噷闇�瑕佹牴鎹疄闄呮儏鍐佃皟鐢ㄦ帴鍙h幏鍙栭棶鍗锋暟鎹�
+        // 濡傛灉recordData涓凡缁忓寘鍚簡闂嵎鏁版嵁锛屽彲浠ョ洿鎺ヤ娇鐢�
+        if (this.currentRecord.taskid && this.currentRecord.patid) {
+          const params = {
+            taskid: this.currentRecord.taskid,
+            patid: this.currentRecord.patid,
+            subId: this.currentRecord.subId || this.currentRecord.id,
+            isFinish: true
+          };
+
+          const res = await getsearchrResults(params);
+          if (res.code === 200 && res.data) {
+            this.templateData = res.data.scriptResult || [];
+            this.taskName = res.data.taskName || '';
+
+            // 澶勭悊鏁版嵁鏍煎紡
+            this.templateData.forEach((item) => {
+              if (item.scriptType == 2) item.scriptResult = [];
+              if (item.scriptResultId && item.scriptType != 2) {
+                item.isoption = 3;
+                item.scriptResult = item.scriptResult;
+              } else if (item.scriptResultId && item.scriptType == 2) {
+                item.scriptResult = item.scriptResult.split("&");
+                item.isoption = 3;
+              }
+            });
+
+            this.overdata();
+          }
+        }
+      } catch (error) {
+        console.error('鍔犺浇闂嵎鏁版嵁澶辫触:', error);
+      }
+    },
+
+    // 澶勭悊寮傚父鏁版嵁
+    overdata() {
+      this.templateData.forEach((item, index) => {
+        var obj = item.svyTaskTemplateTargetoptions.find(
+          (items) => items.optioncontent == item.scriptResult
+        );
+        if (obj && obj.isabnormal) {
+          this.templateData[index].isabnormal = obj.isabnormal;
+        }
+        this.$forceUpdate();
+      });
+    },
+
+    // 鍔犺浇璇煶鏁版嵁
+    async loadVoiceData() {
+      try {
+        if (this.currentRecord.taskid && this.currentRecord.patid) {
+          const params = {
+            taskid: this.currentRecord.taskid,
+            patid: this.currentRecord.patid,
+            subId: this.currentRecord.subId || this.currentRecord.id
+          };
+
+          const res = await getPersonVoices(params);
+          if (res.code == 200) {
+            this.voiceData = res.data.serviceSubtaskDetails || [];
+            this.voiceAudioUrl = res.data.voice || '';
+            this.taskName = res.data.taskName || '';
+            this.templateData = res.data.filteredDetails || [];
+
+            this.templateData.forEach((item) => {
+              if (item.targetvalue) {
+                item.scriptResult = item.targetvalue.split("&");
+              } else {
+                item.scriptResult = [];
+              }
+            });
+          }
+        }
+      } catch (error) {
+        console.error('鍔犺浇璇煶鏁版嵁澶辫触:', error);
+      }
+    },
+
+    // 鍔犺浇澶勭悊璁板綍
+    async loadProcessRecords() {
+      try {
+        // 杩欓噷鍙互鏍规嵁recordId鍔犺浇澶勭悊鍘嗗彶
+        // 鏆傛椂浣跨敤褰撳墠璁板綍鐨勫鐞嗕俊鎭�
+        if (this.currentRecord.handleTime) {
+          this.processRecords = [{
+            ...this.currentRecord,
+            time: this.currentRecord.handleTime
+          }];
+        }
+      } catch (error) {
+        console.error('鍔犺浇澶勭悊璁板綍澶辫触:', error);
+      }
+    },
+
+    // 澶勭悊寮傚父
+    handleProcess() {
+      this.processForm = {
+        handleFlag: this.currentRecord.handleFlag === '0' ? '1' : '0',
+        ccdepts: this.currentRecord.ccdepts ? this.currentRecord.ccdepts.split(',') : [],
+        handleresult: this.currentRecord.handleresult || '',
+        handledesc: this.currentRecord.handledesc || '',
+        finaloption: this.currentRecord.finaloption || ''
+      };
+      this.processDialogVisible = true;
+    },
+
+    // 鎻愪氦澶勭悊
+    async submitProcess() {
+      this.$refs.processForm.validate(async (valid) => {
+        if (!valid) {
+          return;
+        }
+
+        this.processing = true;
+        try {
+          const submitData = {
+            id: this.currentRecord.id,
+            handleFlag: this.processForm.handleFlag,
+            handleresult: this.processForm.handleresult,
+            handledesc: this.processForm.handledesc,
+            finaloption: this.processForm.finaloption,
+            ccdepts: Array.isArray(this.processForm.ccdepts)
+              ? this.processForm.ccdepts.join(",")
+              : this.processForm.ccdepts
+          };
+
+          const res = await traceedit(submitData);
+          if (res.code === 200) {
+            this.$message.success("澶勭悊鎻愪氦鎴愬姛");
+            this.processDialogVisible = false;
+
+            // 鏇存柊褰撳墠璁板綍
+            this.currentRecord = {
+              ...this.currentRecord,
+              ...submitData,
+              handleBy: this.$store.getters.name, // 褰撳墠鐢ㄦ埛
+              handleTime: new Date().toISOString().replace('T', ' ').substr(0, 19)
+            };
+
+            // 閲嶆柊鍔犺浇澶勭悊璁板綍
+            await this.loadProcessRecords();
+
+            // 瑙﹀彂鐖剁粍浠跺埛鏂�
+            this.$emit('processed');
+          } else {
+            this.$message.error(res.msg || "澶勭悊鎻愪氦澶辫触");
+          }
+        } catch (error) {
+          console.error("澶勭悊鎻愪氦澶辫触:", error);
+          this.$message.error("澶勭悊鎻愪氦澶辫触锛岃绋嶅悗閲嶈瘯");
+        } finally {
+          this.processing = false;
+        }
+      });
+    },
+
+    // 澶勭悊瀵硅瘽妗嗗叧闂�
+    handleClose() {
+      this.$emit('close');
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.exception-detail-dialog {
+  ::v-deep .el-dialog {
+    max-height: 85vh;
+    display: flex;
+    flex-direction: column;
+
+    .el-dialog__body {
+      flex: 1;
+      overflow-y: auto;
+      padding: 20px;
+    }
+  }
+
+  .info-section {
+    margin-bottom: 20px;
+    padding: 20px;
+    background: #f8f9fa;
+    border-radius: 8px;
+    border: 1px solid #ebeef5;
+
+    .section-title {
+      font-size: 16px;
+      font-weight: 600;
+      color: #303133;
+      margin-bottom: 15px;
+      padding-bottom: 10px;
+      border-bottom: 2px solid #409EFF;
+    }
+
+    .info-item {
+      margin-bottom: 12px;
+      display: flex;
+      align-items: center;
+
+      .label {
+        font-size: 14px;
+        color: #606266;
+        min-width: 80px;
+        font-weight: 500;
+      }
+
+      .value {
+        font-size: 14px;
+        color: #303133;
+        font-weight: 500;
+        flex: 1;
+      }
+    }
+  }
+
+  .content-container {
+    margin-bottom: 20px;
+
+    ::v-deep .el-tabs__content {
+      padding: 20px;
+      background: #fff;
+      border-radius: 0 0 4px 4px;
+    }
+
+    .CONTENT, .borderdiv {
+      padding: 20px;
+      background: #fff;
+      border-radius: 6px;
+
+      .title {
+        font-size: 18px;
+        font-weight: 600;
+        color: #303133;
+        margin-bottom: 20px;
+        padding-bottom: 10px;
+        border-bottom: 2px solid #409EFF;
+      }
+
+      .voice-audio {
+        margin-bottom: 20px;
+        display: flex;
+        align-items: center;
+        gap: 10px;
+
+        .audio-player {
+          flex: 1;
+        }
+      }
+
+      .preview-left {
+        .topic-dev {
+          margin-bottom: 20px;
+          padding: 15px;
+          border-radius: 6px;
+          border: 1px solid #ebeef5;
+          background: #fff;
+
+          .dev-text {
+            font-size: 15px;
+            font-weight: 500;
+            color: #303133;
+            margin-bottom: 15px;
+            line-height: 1.5;
+
+            span {
+              color: #606266;
+            }
+          }
+
+          .dev-xx {
+            ::v-deep .el-radio-group,
+            ::v-deep .el-checkbox-group {
+              display: flex;
+              flex-direction: column;
+              gap: 10px;
+            }
+
+            ::v-deep .el-radio,
+            ::v-deep .el-checkbox {
+              margin: 0;
+              padding: 8px 12px;
+              border-radius: 4px;
+              border: 1px solid #ebeef5;
+              transition: all 0.3s;
+
+              &:hover {
+                background: #f5f7fa;
+              }
+
+              &.red-star {
+                border-color: #f56c6c;
+                background: #fef0f0;
+              }
+
+              &.yellow-star {
+                border-color: #e6a23c;
+                background: #fdf6ec;
+              }
+            }
+          }
+
+          .append-input-container {
+            margin-top: 15px;
+          }
+
+          .el-alert {
+            margin-top: 10px;
+          }
+        }
+
+        .leftside {
+          display: flex;
+          align-items: center;
+          gap: 10px;
+          margin-bottom: 10px;
+          font-size: 15px;
+          font-weight: 500;
+          color: #303133;
+
+          i {
+            color: #409EFF;
+          }
+        }
+
+        .offside {
+          display: flex;
+          align-items: flex-start;
+          gap: 10px;
+          margin-bottom: 20px;
+
+          i {
+            color: #67C23A;
+            margin-top: 8px;
+          }
+
+          .offside-value {
+            flex: 1;
+
+            .el-textarea {
+              margin-bottom: 10px;
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .process-section {
+    .section-title {
+      font-size: 16px;
+      font-weight: 600;
+      color: #303133;
+      margin-bottom: 15px;
+      padding-bottom: 10px;
+      border-bottom: 2px solid #409EFF;
+    }
+
+    .process-timeline {
+      ::v-deep .el-timeline-item {
+        padding-bottom: 20px;
+
+        .el-timeline-item__timestamp {
+          font-size: 13px;
+          color: #909399;
+        }
+      }
+
+      .process-item {
+        .process-header {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          margin-bottom: 10px;
+
+          .process-user {
+            font-size: 14px;
+            font-weight: 600;
+            color: #409EFF;
+          }
+        }
+
+        .process-content {
+          .process-depts {
+            margin-bottom: 8px;
+
+            .label {
+              font-size: 13px;
+              color: #606266;
+              margin-right: 5px;
+            }
+
+            .dept-tag {
+              margin-right: 5px;
+              margin-bottom: 5px;
+            }
+          }
+
+          .process-remark {
+            margin-bottom: 8px;
+
+            .label {
+              font-size: 13px;
+              color: #606266;
+              margin-right: 5px;
+            }
+
+            .content {
+              font-size: 13px;
+              color: #303133;
+              line-height: 1.5;
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .dialog-footer {
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+    gap: 10px;
+  }
+}
+
+// 寮傚父鏍峰紡
+.scriptTopic-isabnormal {
+  border-color: #f56c6c !important;
+  background: #fef0f0 !important;
+}
+
+.scriptTopic-warning {
+  border-color: #e6a23c !important;
+  background: #fdf6ec !important;
+}
+</style>

--
Gitblit v1.9.3