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

---
 src/views/Satisfaction/configurationmyd/index.vue | 1590 ++++++++++++++++++++++++++++++++++++++++++++++++++--------
 1 files changed, 1,360 insertions(+), 230 deletions(-)

diff --git a/src/views/Satisfaction/configurationmyd/index.vue b/src/views/Satisfaction/configurationmyd/index.vue
index 8aa3dc9..b92dfd9 100644
--- a/src/views/Satisfaction/configurationmyd/index.vue
+++ b/src/views/Satisfaction/configurationmyd/index.vue
@@ -5,13 +5,146 @@
       <div class="header-content">
         <h2 class="page-title">婊℃剰搴﹂鐩紓甯稿鐞嗛厤缃�</h2>
         <p class="page-description">
-          涓烘弧鎰忓害棰樼洰閰嶇疆璐d换绉戝鍜屾姤澶囩瀹わ紝浼樺寲寮傚父鍙嶉娴佺▼
+          鍩轰簬妯℃澘閰嶇疆婊℃剰搴﹂鐩殑璐d换绉戝鍜屾姤澶囩瀹�
         </p>
       </div>
     </div>
 
-    <!-- 鎼滅储鍖哄煙 -->
-    <div class="search-card">
+    <!-- 妯℃澘閫夋嫨鍖哄煙 -->
+    <div class="template-section">
+      <el-card shadow="never">
+        <div class="template-header">
+          <h3 class="template-title">妯℃澘閫夋嫨</h3>
+          <p class="template-tip">璇峰厛閫夋嫨妯℃澘绫诲瀷鍜屽叿浣撴ā鏉�</p>
+        </div>
+
+        <el-form
+          :model="templateForm"
+          :rules="templateRules"
+          ref="templateForm"
+          label-width="120px"
+          size="medium"
+        >
+          <el-row :gutter="20">
+            <el-col :span="8">
+              <el-form-item label="妯℃澘绫诲瀷" prop="templateType">
+                <el-select
+                  v-model="templateForm.templateType"
+                  placeholder="璇烽�夋嫨妯℃澘绫诲瀷"
+                  clearable
+                  @change="handleTemplateTypeChange"
+                  style="width: 100%"
+                >
+                  <el-option label="闂嵎妯℃澘" :value="1" />
+                  <el-option label="璇煶妯℃澘" :value="2" />
+                </el-select>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="8">
+              <el-form-item
+                label="閫夋嫨妯℃澘"
+                prop="templateId"
+                :rules="
+                  templateForm.templateType
+                    ? [
+                        {
+                          required: true,
+                          message: '璇烽�夋嫨妯℃澘',
+                          trigger: 'change',
+                        },
+                      ]
+                    : []
+                "
+              >
+                <el-select
+                  v-model="templateForm.templateId"
+                  placeholder="璇烽�夋嫨妯℃澘"
+                  clearable
+                  filterable
+                  @change="handleTemplateChange"
+                  style="width: 100%"
+                >
+                  <el-option
+                    v-for="template in filteredTemplateOptions"
+                    :key="template.id"
+                    :label="template.templateName"
+                    :value="template.id"
+                  />
+                  <div
+                    v-if="templateOptionsLoading"
+                    slot="empty"
+                    class="select-loading"
+                  >
+                    <i class="el-icon-loading"></i>
+                    <span>鍔犺浇涓�...</span>
+                  </div>
+                </el-select>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="8">
+              <el-form-item>
+                <el-button
+                  type="primary"
+                  icon="el-icon-search"
+                  @click="handleLoadTemplate"
+                  :loading="templateLoading"
+                  :disabled="!templateForm.templateId"
+                >
+                  鍔犺浇妯℃澘棰樼洰
+                </el-button>
+                <el-button icon="el-icon-refresh" @click="handleResetTemplate">
+                  閲嶇疆
+                </el-button>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+      </el-card>
+    </div>
+
+    <!-- 妯℃澘淇℃伅 -->
+    <div v-if="currentTemplateInfo" class="template-info-section">
+      <el-card shadow="never">
+        <div class="template-info">
+          <div class="info-left">
+            <h3 class="template-name">
+              {{ currentTemplateInfo.templateName }}
+            </h3>
+            <div class="template-meta">
+              <span class="meta-item">
+                <i class="el-icon-s-order"></i>
+                妯℃澘绫诲瀷锛歿{
+                  templateForm.templateType === 1 ? "闂嵎妯℃澘" : "璇煶妯℃澘"
+                }}
+              </span>
+              <span class="meta-item">
+                <i class="el-icon-s-management"></i>
+                棰樼洰鎬绘暟锛歿{ currentTemplateInfo.questionCount || 0 }}
+              </span>
+              <span class="meta-item">
+                <i class="el-icon-star-on"></i>
+                婊℃剰搴﹂鐩細{{ satisfactionQuestionsCount }}
+              </span>
+            </div>
+          </div>
+          <div class="info-right">
+            <el-tag
+              :type="
+                currentTemplateInfo.templateStatus === 1 ? 'success' : 'info'
+              "
+              size="medium"
+            >
+              {{ currentTemplateInfo.templateStatus === 1 ? "鍚敤" : "鍋滅敤" }}
+            </el-tag>
+          </div>
+        </div>
+      </el-card>
+    </div>
+
+    <!-- 鎼滅储鍖哄煙锛堥鐩瓫閫夛級 -->
+    <div v-if="questionList.length > 0" class="search-section">
       <el-card shadow="never" class="search-container">
         <el-form :model="queryParams" :inline="true" size="medium">
           <el-form-item label="闂涓婚">
@@ -30,30 +163,16 @@
               @keyup.enter.native="handleQuery"
             />
           </el-form-item>
-          <el-form-item label="鏄惁鍙敤">
-            <el-select
-              v-model="queryParams.isavailable"
-              placeholder="璇烽�夋嫨"
-              clearable
-            >
-              <el-option
-                v-for="item in qyoptions"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
-              />
-            </el-select>
-          </el-form-item>
           <el-form-item>
             <el-button
               type="primary"
               icon="el-icon-search"
               @click="handleQuery"
             >
-              鎼滅储
+              绛涢�夐鐩�
             </el-button>
             <el-button icon="el-icon-refresh" @click="resetQuery">
-              閲嶇疆
+              閲嶇疆绛涢��
             </el-button>
           </el-form-item>
         </el-form>
@@ -79,7 +198,9 @@
             <span v-if="changedCount > 0" class="change-count">
               鏈� {{ changedCount }} 椤归厤缃渶瑕佷繚瀛�
             </span>
-            <div class="total-count">鍏� {{ total }} 鏉¤褰�</div>
+            <div class="total-count">
+              鍏� {{ filteredQuestionList.length }} 鏉¤褰�
+            </div>
           </div>
         </el-card>
       </div>
@@ -91,18 +212,22 @@
         </div>
       </div>
 
-      <div v-else-if="questionList.length === 0" class="empty-wrapper">
-        <el-empty description="鏆傛棤婊℃剰搴﹂鐩暟鎹�">
-          <el-button type="primary" @click="getQuestionList"
-            >鍒锋柊鏁版嵁</el-button
-          >
+      <div
+        v-else-if="questionList.length === 0 && templateForm.templateId"
+        class="empty-wrapper"
+      >
+        <el-empty description="璇ユā鏉夸腑鏆傛棤婊℃剰搴﹂鐩�">
+          <p class="empty-tip">
+            璇烽�夋嫨鍏朵粬妯℃澘鎴栨鏌ユā鏉夸腑鏄惁鍖呭惈婊℃剰搴︾被鍨嬮鐩紙鍒嗙被ID:
+            404,405,406锛�
+          </p>
         </el-empty>
       </div>
 
       <!-- 涓�琛屼竴琛岀殑鍗$墖鍒楄〃 -->
-      <div v-else class="question-list">
+      <div v-else-if="filteredQuestionList.length > 0" class="question-list">
         <div
-          v-for="(question, index) in questionList"
+          v-for="(question, index) in filteredQuestionList"
           :key="question.id"
           class="question-item"
         >
@@ -124,12 +249,6 @@
                       {{ question.scriptTopic || "鏃犱富棰�" }}
                     </h3>
                     <div class="question-tags">
-                      <el-tag
-                        :type="question.isavailable == 1 ? 'danger' : 'success'"
-                        size="small"
-                      >
-                        {{ question.isavailable == 1 ? "涓嶅彲鐢�" : "鍙敤" }}
-                      </el-tag>
                       <dict-tag
                         :options="askvaluetype"
                         :value="question.scriptType"
@@ -153,6 +272,45 @@
                 </div>
               </div>
               <div class="header-right">
+                <!-- 寮傚父閫夐」鐘舵�� -->
+                <div
+                  class="option-status"
+                  v-if="
+                    templateForm.templateType != 3 &&
+                    templateForm.templateType != 4
+                  "
+                >
+                  <el-tooltip
+                    :content="
+                      checkHasAbnormalOptions(question)
+                        ? '宸叉湁寮傚父閫夐」'
+                        : '鏆傛棤寮傚父閫夐」'
+                    "
+                    placement="top"
+                  >
+                    <el-tag
+                      :type="
+                        checkHasAbnormalOptions(question) ? 'success' : 'danger'
+                      "
+                      size="small"
+                      class="status-tag"
+                    >
+                      <i
+                        :class="
+                          checkHasAbnormalOptions(question)
+                            ? 'el-icon-success'
+                            : 'el-icon-warning'
+                        "
+                      ></i>
+                      {{
+                        checkHasAbnormalOptions(question)
+                          ? "寮傚父閫夐」宸查厤缃�"
+                          : "鏃犲紓甯搁�夐」"
+                      }}
+                    </el-tag>
+                  </el-tooltip>
+                </div>
+
                 <el-button
                   type="text"
                   icon="el-icon-view"
@@ -160,6 +318,20 @@
                   size="small"
                 >
                   棰勮
+                </el-button>
+
+                <!-- 娣诲姞閰嶇疆閫夐」鎸夐挳 -->
+                <el-button
+                  v-if="
+                    templateForm.templateType != 3 &&
+                    templateForm.templateType != 4
+                  "
+                  type="text"
+                  icon="el-icon-setting"
+                  @click="openOptionDialog(question)"
+                  size="small"
+                >
+                  閰嶇疆閫夐」
                 </el-button>
               </div>
             </div>
@@ -180,7 +352,7 @@
                 class="config-form"
               >
                 <div class="config-fields">
-                  <!-- 璐d换绉戝 -->
+                  <!-- 璐d换绉戝锛堝閫夛級 -->
                   <div class="config-field">
                     <el-form-item
                       label="璐d换绉戝"
@@ -192,21 +364,24 @@
                         placeholder="璇烽�夋嫨璐d换绉戝"
                         filterable
                         clearable
+                        multiple
                         style="width: 100%"
                         @change="handleConfigChange(question)"
                       >
                         <el-option
                           v-for="dept in deptOptions"
                           :key="dept.id"
-                          :label="dept.name"
-                          :value="dept.id"
+                          :label="dept.label"
+                          :value="dept.deptCode"
                         />
                       </el-select>
-                      <div class="config-tip">璐熻矗澶勭悊璇ラ鐩弽棣堢殑绉戝</div>
+                      <div class="config-tip">
+                        璐熻矗澶勭悊璇ラ鐩弽棣堢殑绉戝锛屽彲澶氶��
+                      </div>
                     </el-form-item>
                   </div>
 
-                  <!-- 鎶ュ绉戝 -->
+                  <!-- 鎶ュ绉戝锛堝閫夛級 -->
                   <div class="config-field">
                     <el-form-item
                       label="鎶ュ绉戝"
@@ -219,15 +394,14 @@
                         filterable
                         clearable
                         multiple
-                        collapse-tags
                         style="width: 100%"
                         @change="handleConfigChange(question)"
                       >
                         <el-option
                           v-for="dept in deptOptions"
                           :key="dept.id"
-                          :label="dept.name"
-                          :value="dept.id"
+                          :label="dept.label"
+                          :value="dept.deptCode"
                         />
                       </el-select>
                       <div class="config-tip">
@@ -235,24 +409,31 @@
                       </div>
                     </el-form-item>
                   </div>
+                </div>
 
-                  <!-- 閫氱煡鏂瑰紡 -->
-                  <div class="config-field">
-                    <el-form-item
-                      label="閫氱煡鏂瑰紡"
-                      prop="notifyTypes"
-                      class="config-item"
-                    >
-                      <el-checkbox-group
-                        v-model="question.exceptionConfig.notifyTypes"
-                        @change="handleConfigChange(question)"
-                      >
-                        <el-checkbox label="system">绯荤粺娑堟伅</el-checkbox>
-                        <el-checkbox label="sms">鐭俊</el-checkbox>
-                        <el-checkbox label="email">閭欢</el-checkbox>
-                        <el-checkbox label="wechat">浼佷笟寰俊</el-checkbox>
-                      </el-checkbox-group>
-                    </el-form-item>
+                <!-- 褰撳墠閰嶇疆淇℃伅 -->
+                <div v-if="question.hasChanges" class="current-config">
+                  <div class="config-preview">
+                    <div class="preview-item">
+                      <span class="preview-label">璐d换绉戝锛�</span>
+                      <span class="preview-value">
+                        {{
+                          getDeptNames(
+                            question.exceptionConfig.responsibilityDept || []
+                          ).join(", ")
+                        }}
+                      </span>
+                    </div>
+                    <div class="preview-item">
+                      <span class="preview-label">鎶ュ绉戝锛�</span>
+                      <span class="preview-value">
+                        {{
+                          getDeptNames(
+                            question.exceptionConfig.reportDept || []
+                          ).join(", ")
+                        }}
+                      </span>
+                    </div>
                   </div>
                 </div>
 
@@ -299,19 +480,109 @@
           </el-card>
         </div>
       </div>
-
-      <!-- 鍒嗛〉 -->
-      <div v-if="questionList.length > 0" class="pagination-wrapper">
-        <pagination
-          v-show="total > 0"
-          :total="total"
-          :page.sync="queryParams.pageNum"
-          :limit.sync="queryParams.pageSize"
-          @pagination="getQuestionList"
-        />
-      </div>
+    </div>
+<!-- 閫夐」閰嶇疆瀵硅瘽妗� -->
+<el-dialog
+  title="閫夐」寮傚父鐘舵�侀厤缃�"
+  :visible.sync="optionDialogVisible"
+  width="700px"
+  center
+  :close-on-click-modal="false"
+>
+  <div v-if="editingQuestion" class="option-config-wrapper">
+    <div class="dialog-header">
+      <h4>{{ editingQuestion.scriptTopic || '鏃犱富棰�' }}</h4>
+      <p class="dialog-subtitle">{{ editingQuestion.scriptContent }}</p>
     </div>
 
+    <div class="option-list">
+      <el-alert
+        v-if="!currentOptions.some(opt => opt.isabnormal === 1)"
+        title="璇疯嚦灏戣缃竴涓紓甯搁�夐」锛堟爣璁颁负寮傚父锛�"
+        type="warning"
+        :closable="false"
+        show-icon
+        style="margin-bottom: 20px;"
+      />
+
+      <div v-for="(option, index) in currentOptions" :key="index" class="option-item">
+        <el-form
+          :model="option"
+          :rules="optionRules"
+          ref="optionForm"
+          size="small"
+          class="option-form"
+        >
+          <el-row :gutter="12" align="middle">
+            <el-col :span="2">
+              <div class="option-index">#{{ index + 1 }}</div>
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item prop="targetvalue">
+                <el-input
+                  v-model="option.targetvalue"
+                  placeholder="璇疯緭鍏ラ�夐」鍐呭"
+                  clearable
+                  maxlength="200"
+                  show-word-limit
+                />
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="6">
+              <el-form-item prop="isabnormal">
+                <el-select
+                  v-model="option.isabnormal"
+                  placeholder="閫夋嫨鐘舵��"
+                  style="width: 100%"
+                >
+                  <el-option
+                    v-for="status in abnormalOptions"
+                    :key="status.value"
+                    :label="status.label"
+                    :value="status.value"
+                  >
+                    <el-tag :type="status.type" size="small">{{ status.label }}</el-tag>
+                  </el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="4">
+              <el-button
+                type="danger"
+                icon="el-icon-delete"
+                @click="removeOption(index)"
+                size="small"
+                circle
+                plain
+              />
+            </el-col>
+          </el-row>
+        </el-form>
+      </div>
+
+      <!-- <el-button
+        type="primary"
+        icon="el-icon-plus"
+        @click="addNewOption"
+        size="small"
+        plain
+        style="width: 100%; margin-top: 10px;"
+      >
+        娣诲姞閫夐」
+      </el-button> -->
+    </div>
+  </div>
+
+  <span slot="footer" class="dialog-footer">
+    <el-button @click="optionDialogVisible = false">鍙栨秷</el-button>
+    <el-button type="primary" @click="saveOptions" :loading="savingOptions">
+      淇濆瓨閰嶇疆
+    </el-button>
+  </span>
+</el-dialog>
     <!-- 棰樼洰棰勮瀵硅瘽妗� -->
     <el-dialog
       title="棰樼洰棰勮"
@@ -328,19 +599,14 @@
               :value="currentPreview.scriptType"
               size="small"
             />
-            <el-tag
-              :type="currentPreview.isavailable === 1 ? 'success' : 'danger'"
-              size="small"
-            >
-              {{ currentPreview.isavailable === 1 ? "鍙敤" : "涓嶅彲鐢�" }}
-            </el-tag>
             <el-tag v-if="currentPreview.targetname" size="small" type="info">
               {{ currentPreview.targetname }}
             </el-tag>
           </div>
         </div>
+        <!-- 妯℃澘棰樼洰灞曠ず -->
 
-        <div class="preview-content">
+        <div class="preview-content" v-if="templateForm.templateType == 1">
           <p class="preview-question">{{ currentPreview.scriptContent }}</p>
 
           <div
@@ -351,13 +617,47 @@
           >
             <el-radio-group v-model="previewAnswer">
               <el-radio
-                v-for="(option, idx) in currentPreview.svyLibScriptOptions ||
-                []"
+                v-for="(
+                  option, idx
+                ) in currentPreview.svyLibTemplateTargetoptions || []"
                 :key="idx"
                 :label="option.optioncontent"
                 class="option-item"
               >
                 {{ option.optioncontent }}
+              </el-radio>
+            </el-radio-group>
+          </div>
+
+          <div v-else class="preview-textarea">
+            <el-input
+              type="textarea"
+              placeholder="璇疯緭鍏ュ洖绛�"
+              v-model="previewAnswer"
+              :rows="4"
+            />
+          </div>
+        </div>
+        <!-- 璇煶棰樼洰灞曠ず -->
+        <div class="preview-content" v-else>
+          <p class="preview-question">{{ currentPreview.scriptContent }}</p>
+
+          <div
+            v-if="
+              currentPreview.scriptType != 3 && currentPreview.scriptType != 4
+            "
+            class="preview-options"
+          >
+            <el-radio-group v-model="previewAnswer">
+              <el-radio
+                v-for="(
+                  option, idx
+                ) in currentPreview.ivrLibaScriptTargetoptionList || []"
+                :key="idx"
+                :label="option.targetvalue"
+                class="option-item"
+              >
+                {{ option.targetvalue }}
               </el-radio>
             </el-radio-group>
           </div>
@@ -399,10 +699,16 @@
 
 <script>
 import {
-  getissuelist,
   compileissue,
-  getissueclassify,
+  compileQtemplate,
+  compileFollowup,
+  getQtemplatelist,
+  getFollowuplist,
+  getvFollowup,
+  getQtemplateobj,
+  selectInfoByConditiony,
 } from "@/api/AiCentre/index";
+import { deptTreeSelect } from "@/api/system/user";
 import store from "@/store";
 import Pagination from "@/components/Pagination";
 
@@ -411,28 +717,58 @@
   components: { Pagination },
   data() {
     return {
+      // 妯℃澘琛ㄥ崟
+      templateForm: {
+        templateType: "",
+        templateId: "",
+      },
+      templateRules: {
+        templateType: [
+          { required: true, message: "璇烽�夋嫨妯℃澘绫诲瀷", trigger: "change" },
+        ],
+      },
+      // 閫夐」绠$悊鐩稿叧
+      optionDialogVisible: false,
+      currentOptions: [],
+      editingQuestion: null,
+      optionRules: {
+        targetvalue: [
+          { required: true, message: "璇疯緭鍏ラ�夐」鍐呭", trigger: "blur" },
+        ],
+        isabnormal: [
+          { required: true, message: "璇烽�夋嫨寮傚父鐘舵��", trigger: "change" },
+        ],
+      },
+
+      // 寮傚父鐘舵�侀�夐」
+      abnormalOptions: [
+        { label: "姝e父", value: 0, type: "success" },
+        { label: "寮傚父", value: 1, type: "danger" },
+        { label: "璀﹀憡", value: 2, type: "warning" },
+      ],
+      // 妯℃澘閫夐」
+      questionnaireTemplates: [], // 闂嵎妯℃澘鍒楄〃
+      followupTemplates: [], // 璇煶妯℃澘鍒楄〃
+      templateOptionsLoading: false,
+
+      // 褰撳墠妯℃澘淇℃伅
+      currentTemplateInfo: null,
+      templateLoading: false,
+
       // 鏌ヨ鍙傛暟
       queryParams: {
-        pageNum: 1,
-        pageSize: 10,
         scriptTopic: "",
         scriptContent: "",
-        targetname: "",
-        isavailable: "",
-        categoryids: "404,405,406", // 鍥哄畾鏌ヨ婊℃剰搴︾被鍨�
       },
 
       // 鏁版嵁鍒楄〃
       questionList: [],
-      total: 0,
       loading: false,
       batchSaving: false,
 
       // 瀛楀吀鏁版嵁
       askvaluetype: store.getters.askvaluetype || [],
       qyoptions: store.getters.usable || [],
-      mode: store.getters.mode || [],
-      languagelist: store.getters.languagelist || [],
 
       // 绉戝閫夐」
       deptOptions: [],
@@ -447,21 +783,22 @@
       hasChanges: false,
       changedCount: 0,
 
+      // 婊℃剰搴﹀垎绫籌D
+      satisfactionCategoryIds: ["404", "405", "406", "10039", "10041", "10042"],
+      questionnaireCategorys: [],
+      voiceCategories: [],
       // 琛ㄥ崟楠岃瘉瑙勫垯
       configRules: {
         responsibilityDept: [
-          { required: true, message: "璇烽�夋嫨璐d换绉戝", trigger: "change" },
-        ],
-        reportDept: [
           {
             required: true,
-            message: "璇烽�夋嫨鑷冲皯涓�涓姤澶囩瀹�",
+            message: "璇疯嚦灏戦�夋嫨涓�涓矗浠荤瀹�",
             trigger: "change",
           },
           {
             validator: (rule, value, callback) => {
               if (!value || value.length === 0) {
-                callback(new Error("璇烽�夋嫨鑷冲皯涓�涓姤澶囩瀹�"));
+                callback(new Error("璇疯嚦灏戦�夋嫨涓�涓矗浠荤瀹�"));
               } else {
                 callback();
               }
@@ -469,11 +806,16 @@
             trigger: "change",
           },
         ],
-        notifyTypes: [
+        reportDept: [
+          {
+            required: true,
+            message: "璇疯嚦灏戦�夋嫨涓�涓姤澶囩瀹�",
+            trigger: "change",
+          },
           {
             validator: (rule, value, callback) => {
               if (!value || value.length === 0) {
-                callback(new Error("璇疯嚦灏戦�夋嫨涓�绉嶉�氱煡鏂瑰紡"));
+                callback(new Error("璇疯嚦灏戦�夋嫨涓�涓姤澶囩瀹�"));
               } else {
                 callback();
               }
@@ -484,17 +826,117 @@
       },
     };
   },
+  computed: {
+    // 鏍规嵁妯℃澘绫诲瀷杩囨护妯℃澘閫夐」
+    filteredTemplateOptions() {
+      if (this.templateForm.templateType === 1) {
+        return this.questionnaireTemplates;
+      } else if (this.templateForm.templateType === 2) {
+        return this.followupTemplates;
+      }
+      return [];
+    },
+
+    // 婊℃剰搴﹂鐩暟閲�
+    satisfactionQuestionsCount() {
+      if (this.templateForm.templateType === 1) {
+        return this.questionList.filter((q) =>
+          this.questionnaireCategorys.includes(q.categoryid)
+        ).length;
+      } else if (this.templateForm.templateType === 2) {
+        return this.questionList.filter((q) =>
+          this.voiceCategories.includes(q.scriptAssortid)
+        ).length;
+      }
+    },
+    // 妫�鏌ラ鐩槸鍚︽湁寮傚父閫夐」
+    hasAbnormalOption(question) {
+      return (question) => {
+        if (!question) return false;
+
+        // 闂嵎妯℃澘
+        if (this.templateForm.templateType === 1) {
+          const options = question.svyLibTemplateTargetoptions || [];
+          return options.some((opt) => opt.isabnormal === 1);
+        }
+        // 璇煶妯℃澘
+        else if (this.templateForm.templateType === 2) {
+          const options = question.ivrLibaScriptTargetoptionList || [];
+          return options.some((opt) => opt.isabnormal === 1);
+        }
+
+        return false;
+      };
+    },
+    // 绛涢�夊悗鐨勯鐩垪琛�
+    filteredQuestionList() {
+      let filtered = this.questionList;
+      console.log(this.questionnaireCategorys);
+
+      // 绛涢�夋弧鎰忓害棰樼洰
+      if (this.templateForm.templateType === 1) {
+        filtered = filtered.filter((q) =>
+          this.questionnaireCategorys.includes(q.categoryid)
+        );
+      } else if (this.templateForm.templateType === 2) {
+        filtered = filtered.filter((q) =>
+          this.voiceCategories.includes(q.scriptAssortid)
+        );
+      }
+
+      // 搴旂敤鎼滅储鏉′欢
+      if (this.queryParams.scriptTopic) {
+        const keyword = this.queryParams.scriptTopic.toLowerCase();
+        filtered = filtered.filter(
+          (q) => q.scriptTopic && q.scriptTopic.toLowerCase().includes(keyword)
+        );
+      }
+
+      if (this.queryParams.scriptContent) {
+        const keyword = this.queryParams.scriptContent.toLowerCase();
+        filtered = filtered.filter(
+          (q) =>
+            q.scriptContent && q.scriptContent.toLowerCase().includes(keyword)
+        );
+      }
+
+      return filtered;
+    },
+  },
   created() {
+    if (store.getters.satisfactionCategories) {
+      this.questionnaireCategorys =
+        store.getters.satisfactionCategories.questionnaireCategorys.map(
+          (item) => item.categoryid
+        );
+      this.voiceCategories =
+        store.getters.satisfactionCategories.voiceCategories.map(
+          (item) => item.categoryid
+        );
+    }
     this.getDeptOptions();
-    this.getQuestionList();
+    this.loadAllTemplates();
   },
   methods: {
+    /** 鍔犺浇鎵�鏈夋ā鏉垮垪琛� */
+    loadAllTemplates() {
+      this.templateOptionsLoading = true;
+
+      // 骞惰鍔犺浇闂嵎妯℃澘鍜岃闊虫ā鏉�
+      Promise.all([
+        this.loadQuestionnaireTemplates(),
+        this.loadFollowupTemplates(),
+      ]).finally(() => {
+        this.templateOptionsLoading = false;
+      });
+    },
+
     /** 鏌ヨ绉戝鍒楄〃 */
     getDeptOptions() {
-      getissueclassify({})
+      deptTreeSelect()
         .then((res) => {
-          if (res.code === 200) {
-            this.deptOptions = res.rows || [];
+          if (res.code == 200) {
+            this.deptOptions = this.flattenArray(res.data) || [];
           }
         })
         .catch((error) => {
@@ -503,64 +945,276 @@
         });
     },
 
-    /** 鏌ヨ婊℃剰搴﹂鐩垪琛� */
-    getQuestionList() {
-      this.loading = true;
+    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;
+    },
+
+    /** 鏍规嵁绉戝缂栫爜鑾峰彇绉戝鍚嶇О */
+    getDeptName(deptCode) {
+      if (!deptCode) return "";
+      const dept = this.deptOptions.find((d) => d.deptCode === deptCode);
+      return dept ? dept.label : deptCode;
+    },
+
+    /** 鏍规嵁绉戝缂栫爜鏁扮粍鑾峰彇绉戝鍚嶇О鏁扮粍 */
+    getDeptNames(deptCodes) {
+      if (!Array.isArray(deptCodes) || deptCodes.length === 0) return [];
+      return deptCodes
+        .map((code) => this.getDeptName(code))
+        .filter((name) => name && name.trim());
+    },
+
+    /** 妯℃澘绫诲瀷鍙樻洿 */
+    handleTemplateTypeChange() {
+      this.templateForm.templateId = "";
+      this.currentTemplateInfo = null;
       this.questionList = [];
+    },
 
-      getissuelist(this.queryParams)
+    /** 鍔犺浇闂嵎妯℃澘鍒楄〃 */
+    loadQuestionnaireTemplates() {
+      return new Promise((resolve) => {
+        getQtemplatelist({ pageSize: 1000 })
+          .then((res) => {
+            if (res.code === 200) {
+              this.questionnaireTemplates = (res.rows || []).map((item) => ({
+                id: item.svyid,
+                templateName: item.svyname,
+                isavailable: item.isavailable,
+              }));
+            } else {
+              this.$message.error(res.msg || "鍔犺浇闂嵎妯℃澘澶辫触");
+            }
+            resolve();
+          })
+          .catch((error) => {
+            console.error("鍔犺浇闂嵎妯℃澘澶辫触:", error);
+            this.$message.error("鍔犺浇闂嵎妯℃澘澶辫触");
+            resolve();
+          });
+      });
+    },
+
+    /** 鍔犺浇璇煶妯℃澘鍒楄〃 */
+    loadFollowupTemplates() {
+      return new Promise((resolve) => {
+        getFollowuplist({ pageSize: 1000 })
+          .then((res) => {
+            if (res.code === 200) {
+              this.followupTemplates = (res.rows || []).map((item) => ({
+                id: item.id,
+                templateName: item.templateName,
+                isavailable: item.isavailable,
+              }));
+            } else {
+              this.$message.error(res.msg || "鍔犺浇璇煶妯℃澘澶辫触");
+            }
+            resolve();
+          })
+          .catch((error) => {
+            console.error("鍔犺浇璇煶妯℃澘澶辫触:", error);
+            this.$message.error("鍔犺浇璇煶妯℃澘澶辫触");
+            resolve();
+          });
+      });
+    },
+
+    /** 妯℃澘閫夋嫨鍙樻洿 */
+    handleTemplateChange(templateId) {
+      if (templateId) {
+        const selectedTemplate = this.filteredTemplateOptions.find(
+          (t) => t.id === templateId
+        );
+        if (selectedTemplate) {
+          this.currentTemplateInfo = {
+            templateName: selectedTemplate.templateName,
+            templateStatus: selectedTemplate.isavailable,
+            questionCount: 0,
+          };
+        }
+        // 鍔犺浇妯℃澘璇︽儏鏁版嵁
+        this.templateLoading = true;
+        this.loading = true;
+        this.questionList = [];
+
+        if (this.templateForm.templateType === 1) {
+          this.loadQuestionnaireTemplateDetail();
+        } else if (this.templateForm.templateType === 2) {
+          this.loadFollowupTemplateDetail();
+        }
+      } else {
+        this.currentTemplateInfo = null;
+        this.questionList = [];
+      }
+    },
+
+    /** 鍔犺浇妯℃澘璇︽儏鍜岄鐩� */
+    handleLoadTemplate() {
+      this.$refs.templateForm.validate((valid) => {
+        if (!valid) {
+          this.$message.warning("璇峰厛閫夋嫨妯℃澘");
+          return;
+        }
+
+        this.templateLoading = true;
+        this.loading = true;
+        this.questionList = [];
+
+        if (this.templateForm.templateType === 1) {
+          this.loadQuestionnaireTemplateDetail();
+        } else if (this.templateForm.templateType === 2) {
+          this.loadFollowupTemplateDetail();
+        }
+      });
+    },
+
+    /** 鍔犺浇闂嵎妯℃澘璇︽儏 */
+    loadQuestionnaireTemplateDetail() {
+      getQtemplateobj({ svyid: this.templateForm.templateId })
         .then((res) => {
+          this.templateLoading = false;
           this.loading = false;
-          if (res.code === 200) {
-            this.questionList = (res.rows || []).map((item) => {
-              // 瑙f瀽寮傚父澶勭悊閰嶇疆
-              let exceptionConfig = {
-                responsibilityDept: "",
-                reportDept: [],
-                notifyTypes: ["system"],
-              };
 
-              try {
-                if (item.otherdata) {
-                  const otherData = JSON.parse(item.otherdata);
-                  if (otherData.exceptionConfig) {
-                    exceptionConfig = {
-                      ...exceptionConfig,
-                      ...otherData.exceptionConfig,
-                    };
-                  }
-                }
-              } catch (error) {
-                console.warn("瑙f瀽寮傚父閰嶇疆澶辫触:", error);
-              }
+          if (res.code === 200 && res.rows && res.rows.length > 0) {
+            const templateDetail = res.rows[0];
 
-              return {
-                ...item,
-                originalConfig: JSON.parse(JSON.stringify(exceptionConfig)),
-                exceptionConfig: exceptionConfig,
-                hasChanges: false,
-                saving: false,
-                saveStatus: null,
-              };
-            });
+            // 鏇存柊妯℃澘淇℃伅
+            this.currentTemplateInfo = {
+              ...templateDetail,
+              templateName: templateDetail.svyname,
+              templateStatus: templateDetail.isavailable,
+              questionCount: templateDetail.svyTemplateLibScripts?.length || 0,
+            };
 
-            this.total = res.total || 0;
-            this.updateChangedStatus();
+            // 鎻愬彇棰樼洰鍒楄〃
+            const questions = templateDetail.svyTemplateLibScripts || [];
+            this.processQuestions(questions);
+
+            this.$message.success(`鎴愬姛鍔犺浇 ${questions.length} 涓鐩甡);
           } else {
-            this.$message.error(res.msg || "鑾峰彇鏁版嵁澶辫触");
+            this.$message.error(res.msg || "鍔犺浇妯℃澘璇︽儏澶辫触");
           }
         })
         .catch((error) => {
+          this.templateLoading = false;
           this.loading = false;
-          console.error("鏌ヨ澶辫触:", error);
-          this.$message.error("鑾峰彇鏁版嵁澶辫触");
+          console.error("鍔犺浇闂嵎妯℃澘璇︽儏澶辫触:", error);
+          this.$message.error("鍔犺浇妯℃澘璇︽儏澶辫触");
         });
+    },
+
+    /** 鍔犺浇璇煶妯℃澘璇︽儏 */
+    loadFollowupTemplateDetail() {
+      getvFollowup({ id: this.templateForm.templateId })
+        .then((res) => {
+          this.templateLoading = false;
+          this.loading = false;
+
+          if (res.code === 200) {
+            const templateDetail = res.data;
+
+            // 鏇存柊妯℃澘淇℃伅
+            this.currentTemplateInfo = {
+              ...this.currentTemplateInfo,
+              templateName: templateDetail.templateName,
+              templateStatus: templateDetail.isavailable,
+              questionCount:
+                templateDetail.ivrLibaTemplateScriptVOList?.length || 0,
+            };
+
+            // 鎻愬彇棰樼洰鍒楄〃
+            const questions = templateDetail.ivrLibaTemplateScriptVOList || [];
+            this.processQuestions(questions);
+
+            this.$message.success(`鎴愬姛鍔犺浇 ${questions.length} 涓鐩甡);
+          } else {
+            this.$message.error(res.msg || "鍔犺浇妯℃澘璇︽儏澶辫触");
+          }
+        })
+        .catch((error) => {
+          this.templateLoading = false;
+          this.loading = false;
+          console.error("鍔犺浇璇煶妯℃澘璇︽儏澶辫触:", error);
+          this.$message.error("鍔犺浇妯℃澘璇︽儏澶辫触");
+        });
+    },
+
+    /** 澶勭悊棰樼洰鏁版嵁 */
+    processQuestions(questions) {
+      this.questionList = questions.map((question) => {
+        // 瑙f瀽璐d换绉戝鍜屾姤澶囩瀹�
+        let exceptionConfig = {
+          responsibilityDept: [], // 璐d换绉戝缂栫爜鏁扮粍
+          reportDept: [], // 鎶ュ绉戝缂栫爜鏁扮粍
+        };
+
+        // 浠庨鐩《灞傚瓧娈佃鍙栨暟鎹�
+        if (question.dutyDeptCode) {
+          // 浠庨�楀彿鍒嗛殧鐨勫瓧绗︿覆杞负鏁扮粍
+          exceptionConfig.responsibilityDept = question.dutyDeptCode
+            .split(",")
+            .map((code) => code.trim())
+            .filter((code) => code);
+        }
+
+        if (question.reportDeptCode) {
+          exceptionConfig.reportDept = question.reportDeptCode
+            .split(",")
+            .map((code) => code.trim())
+            .filter((code) => code);
+        }
+
+        return {
+          ...question,
+          // 缁熶竴瀛楁鍚�
+          id: question.id || question.scriptId,
+          scriptTopic: question.scriptTopic || question.scriptTopic,
+          scriptContent: question.scriptContent || question.scriptContent,
+          scriptType: question.scriptType,
+          isavailable: question.isavailable,
+          targetname: question.targetname,
+          categoryid: question.categoryid || question.categoryid,
+          originalConfig: JSON.parse(JSON.stringify(exceptionConfig)),
+          exceptionConfig: exceptionConfig,
+          hasChanges: false,
+          saving: false,
+          saveStatus: null,
+        };
+      });
+
+      this.updateChangedStatus();
+    },
+
+    /** 閲嶇疆妯℃澘閫夋嫨 */
+    handleResetTemplate() {
+      this.templateForm = {
+        templateType: "",
+        templateId: "",
+      };
+      this.currentTemplateInfo = null;
+      this.questionList = [];
+      this.resetQuery();
+      this.$refs.templateForm?.clearValidate();
     },
 
     /** 閰嶇疆鍙樻洿澶勭悊 */
     handleConfigChange(question) {
       this.$nextTick(() => {
-        const index = this.questionList.findIndex((q) => q.id === question.id);
+        const index = this.filteredQuestionList.findIndex(
+          (q) => q.id === question.id
+        );
         if (index !== -1) {
           const formRef = this.$refs.configForm && this.$refs.configForm[index];
           if (formRef) {
@@ -582,16 +1236,24 @@
     isConfigEqual(config1, config2) {
       if (!config1 || !config2) return false;
 
-      const report1 = [...(config1.reportDept || [])].sort().join(",");
-      const report2 = [...(config2.reportDept || [])].sort().join(",");
-      const notify1 = [...(config1.notifyTypes || [])].sort().join(",");
-      const notify2 = [...(config2.notifyTypes || [])].sort().join(",");
+      const responsibility1 = [...(config1.responsibilityDept || [])]
+        .sort()
+        .join(",")
+        .toLowerCase();
+      const responsibility2 = [...(config2.responsibilityDept || [])]
+        .sort()
+        .join(",")
+        .toLowerCase();
+      const report1 = [...(config1.reportDept || [])]
+        .sort()
+        .join(",")
+        .toLowerCase();
+      const report2 = [...(config2.reportDept || [])]
+        .sort()
+        .join(",")
+        .toLowerCase();
 
-      return (
-        config1.responsibilityDept === config2.responsibilityDept &&
-        report1 === report2 &&
-        notify1 === notify2
-      );
+      return responsibility1 === responsibility2 && report1 === report2;
     },
 
     /** 鏇存柊鍙樻洿鐘舵�� */
@@ -605,7 +1267,11 @@
     async saveSingleConfig(question) {
       if (!question.hasChanges) return;
 
-      const index = this.questionList.findIndex((q) => q.id === question.id);
+      const index = this.filteredQuestionList.findIndex(
+        (q) => q.id === question.id
+      );
+      console.log(index, "filteredQuestionList");
+
       if (index === -1) return;
 
       const formRef = this.$refs.configForm && this.$refs.configForm[index];
@@ -621,62 +1287,129 @@
       question.saveStatus = null;
 
       try {
-        // 鏋勫缓淇濆瓨鏁版嵁
-        const saveData = {
-          id: question.id,
-          isoperation: 2, // 淇敼鎿嶄綔
-          ...question,
+        // 鑾峰彇褰撳墠妯℃澘璇︽儏
+        let templateDetail;
+        if (this.templateForm.templateType === 1) {
+          // 闂嵎妯℃澘
+          const res = await getQtemplateobj({
+            svyid: this.templateForm.templateId,
+          });
+          if (res.code !== 200 || !res.rows || res.rows.length === 0) {
+            throw new Error(res.msg || "鑾峰彇妯℃澘璇︽儏澶辫触");
+          }
+          templateDetail = res.rows[0];
+        } else if (this.templateForm.templateType === 2) {
+          // 璇煶妯℃澘
+          const res = await getvFollowup({ id: this.templateForm.templateId });
+          if (res.code !== 200) {
+            throw new Error(res.msg || "鑾峰彇妯℃澘璇︽儏澶辫触");
+          }
+          templateDetail = res.data;
+        }
+
+        // 鏇存柊棰樼洰閰嶇疆
+        let updatedTemplateDetail = { ...templateDetail };
+        let questionsField =
+          this.templateForm.templateType === 1
+            ? "svyTemplateLibScripts"
+            : "ivrLibaTemplateScriptVOList";
+
+        const questions = updatedTemplateDetail[questionsField] || [];
+        const questionIndex = questions.findIndex((q) => q.id === question.id);
+
+        if (questionIndex === -1) {
+          throw new Error("鏈壘鍒伴鐩�");
+        }
+
+        // 鑾峰彇绉戝鍚嶇О
+        const responsibilityDeptNames = this.getDeptNames(
+          question.exceptionConfig.responsibilityDept
+        );
+        const reportDeptNames = this.getDeptNames(
+          question.exceptionConfig.reportDept
+        );
+
+        // 鐩存帴鏇存柊棰樼洰椤跺眰瀛楁
+        questions[questionIndex] = {
+          ...questions[questionIndex],
+          // 璁剧疆Excel瑕佹眰鐨勫瓧娈�
+          dutyDeptCode: question.exceptionConfig.responsibilityDept.join(","),
+          dutyDeptName: responsibilityDeptNames.join(","),
+          reportDeptCode: question.exceptionConfig.reportDept.join(","),
+          reportDeptName: reportDeptNames.join(","),
         };
 
-        // 灏嗗紓甯搁厤缃繚瀛樺埌 otherdata
-        const otherData = JSON.parse(question.otherdata || "{}");
-        otherData.exceptionConfig = question.exceptionConfig;
-        saveData.otherdata = JSON.stringify(otherData);
+        // 鏇存柊妯℃澘
+        updatedTemplateDetail[questionsField] = questions;
 
-        // 绉婚櫎涓嶉渶瑕佺殑瀛楁
-        delete saveData.originalConfig;
-        delete saveData.hasChanges;
-        delete saveData.saving;
-        delete saveData.saveStatus;
-        delete saveData.exceptionConfig;
-
-        const response = await compileissue(saveData);
+        // 淇濆瓨妯℃澘
+        let response;
+        if (this.templateForm.templateType === 1) {
+          response = await compileQtemplate({
+            ...updatedTemplateDetail,
+            id: this.templateForm.templateId,
+            isoperation: 2,
+          });
+        } else {
+          response = await compileFollowup({
+            ...updatedTemplateDetail,
+            id: this.templateForm.templateId,
+            isoperation: 2,
+          });
+        }
 
         if (response.code === 200) {
-          // 鏇存柊鍘熷閰嶇疆
-          question.originalConfig = JSON.parse(
-            JSON.stringify(question.exceptionConfig)
-          );
-          question.hasChanges = false;
-          question.saveStatus = {
-            type: "success",
-            message: "閰嶇疆淇濆瓨鎴愬姛",
-          };
-
-          this.updateChangedStatus();
-          this.$message.success("閰嶇疆淇濆瓨鎴愬姛");
-
-          // 5绉掑悗娓呴櫎鎴愬姛鎻愮ず
-          setTimeout(() => {
-            question.saveStatus = null;
-          }, 5000);
+          this.handleSaveSuccess(question);
         } else {
-          question.saveStatus = {
-            type: "error",
-            message: response.msg || "淇濆瓨澶辫触",
-          };
-          this.$message.error(response.msg || "淇濆瓨澶辫触");
+          throw new Error(response.msg || "淇濆瓨澶辫触");
         }
       } catch (error) {
         console.error("淇濆瓨澶辫触:", error);
         question.saveStatus = {
           type: "error",
-          message: "淇濆瓨澶辫触锛岃绋嶅悗閲嶈瘯",
+          message: error.message || "淇濆瓨澶辫触锛岃绋嶅悗閲嶈瘯",
         };
-        this.$message.error("淇濆瓨澶辫触锛岃绋嶅悗閲嶈瘯");
+        this.$message.error(error.message || "淇濆瓨澶辫触锛岃绋嶅悗閲嶈瘯");
       } finally {
         question.saving = false;
       }
+    },
+
+    /** 澶勭悊淇濆瓨鎴愬姛 */
+    /** 澶勭悊淇濆瓨鎴愬姛 */
+    handleSaveSuccess(question) {
+      // 鍚屾椂鏇存柊棰樼洰椤跺眰瀛楁
+      const responsibilityDeptNames = this.getDeptNames(
+        question.exceptionConfig.responsibilityDept
+      );
+      const reportDeptNames = this.getDeptNames(
+        question.exceptionConfig.reportDept
+      );
+
+      // 鏇存柊棰樼洰鏈韩鐨勫瓧娈�
+      question.dutyDeptCode =
+        question.exceptionConfig.responsibilityDept.join(",");
+      question.dutyDeptName = responsibilityDeptNames.join(",");
+      question.reportDeptCode = question.exceptionConfig.reportDept.join(",");
+      question.reportDeptName = reportDeptNames.join(",");
+
+      // 鏇存柊鍘熷閰嶇疆
+      question.originalConfig = JSON.parse(
+        JSON.stringify(question.exceptionConfig)
+      );
+      question.hasChanges = false;
+      question.saveStatus = {
+        type: "success",
+        message: "閰嶇疆淇濆瓨鎴愬姛",
+      };
+
+      this.updateChangedStatus();
+      this.$message.success("閰嶇疆淇濆瓨鎴愬姛");
+
+      // 5绉掑悗娓呴櫎鎴愬姛鎻愮ず
+      setTimeout(() => {
+        question.saveStatus = null;
+      }, 5000);
     },
 
     /** 閲嶇疆鍗曚釜棰樼洰閰嶇疆 */
@@ -690,6 +1423,21 @@
           question.exceptionConfig = JSON.parse(
             JSON.stringify(question.originalConfig)
           );
+          // 鍚屾椂閲嶇疆棰樼洰椤跺眰瀛楁
+          const responsibilityDeptNames = this.getDeptNames(
+            question.exceptionConfig.responsibilityDept
+          );
+          const reportDeptNames = this.getDeptNames(
+            question.exceptionConfig.reportDept
+          );
+
+          question.dutyDeptCode =
+            question.exceptionConfig.responsibilityDept.join(",");
+          question.dutyDeptName = responsibilityDeptNames.join(",");
+          question.reportDeptCode =
+            question.exceptionConfig.reportDept.join(",");
+          question.reportDeptName = reportDeptNames.join(",");
+
           question.hasChanges = false;
           question.saveStatus = null;
           this.updateChangedStatus();
@@ -757,25 +1505,258 @@
       this.previewAnswer = "";
       this.previewVisible = true;
     },
+    /** 妫�鏌ラ鐩槸鍚︽湁寮傚父閫夐」 */
+    checkHasAbnormalOptions(question) {
+      if (this.templateForm.templateType === 1) {
+        return (question.svyLibTemplateTargetoptions || []).some(
+          (opt) => opt.isabnormal === 1
+        );
+      } else if (this.templateForm.templateType === 2) {
+        return (question.ivrLibaScriptTargetoptionList || []).some(
+          (opt) => opt.isabnormal === 1
+        );
+      }
+      return false;
+    },
 
+    /** 鎵撳紑閫夐」绠$悊瀵硅瘽妗� */
+    openOptionDialog(question) {
+      this.editingQuestion = question;
+
+      // 澶嶅埗閫夐」鏁版嵁
+      if (this.templateForm.templateType === 1) {
+        this.currentOptions = JSON.parse(
+          JSON.stringify(question.svyLibTemplateTargetoptions || [])
+        ).map((opt) => ({
+          ...opt,
+          id: opt.id,
+          targetvalue: opt.optioncontent || "",
+          isabnormal: opt.isabnormal || 0,
+        }));
+      } else if (this.templateForm.templateType === 2) {
+        this.currentOptions = JSON.parse(
+          JSON.stringify(question.ivrLibaScriptTargetoptionList || [])
+        ).map((opt) => ({
+          ...opt,
+          targetvalue: opt.targetvalue || "",
+          isabnormal: opt.isabnormal || 0,
+        }));
+      }
+
+      this.optionDialogVisible = true;
+    },
+
+    /** 娣诲姞鏂伴�夐」 */
+    addNewOption() {
+      this.currentOptions.push({
+        id: Date.now(), // 涓存椂ID
+        targetvalue: "",
+        isabnormal: 0,
+        isNew: true,
+      });
+    },
+
+    /** 鍒犻櫎閫夐」 */
+    removeOption(index) {
+      this.currentOptions.splice(index, 1);
+    },
+
+    /** 淇濆瓨閫夐」閰嶇疆 */
+    async saveOptions() {
+      try {
+        // 楠岃瘉蹇呭~椤�
+        for (const option of this.currentOptions) {
+          if (!option.targetvalue || option.targetvalue.trim() === "") {
+            this.$message.warning("璇峰~鍐欐墍鏈夐�夐」鍐呭");
+            return;
+          }
+        }
+
+        // 妫�鏌ユ槸鍚︽湁寮傚父閫夐」
+        const hasAbnormal = this.currentOptions.some(
+          (opt) => opt.isabnormal === 1
+        );
+
+        if (!hasAbnormal) {
+          this.$message.warning("璇疯嚦灏戣缃竴涓紓甯搁�夐」锛坕sabnormal=1锛�");
+          return;
+        }
+
+        // 淇濆瓨閫昏緫 - 鏇存柊棰樼洰瀵硅薄鐨勯�夐」鏁版嵁
+        if (this.templateForm.templateType === 1) {
+          this.editingQuestion.svyLibTemplateTargetoptions =
+            this.currentOptions.map((opt) => ({
+              ...opt,
+              optioncontent: opt.targetvalue,
+              isabnormal: opt.isabnormal,
+            }));
+        } else if (this.templateForm.templateType === 2) {
+          this.editingQuestion.ivrLibaScriptTargetoptionList =
+            this.currentOptions;
+        }
+
+        // 瑙﹀彂閰嶇疆鍙樻洿妫�鏌�
+        this.handleConfigChange(this.editingQuestion);
+
+        this.$message.success("閫夐」閰嶇疆淇濆瓨鎴愬姛");
+        this.optionDialogVisible = false;
+      } catch (error) {
+        console.error("淇濆瓨閫夐」澶辫触:", error);
+        this.$message.error("淇濆瓨閫夐」澶辫触");
+      }
+    },
+
+    /** 淇敼淇濆瓨鍗曚釜棰樼洰閰嶇疆鏂规硶锛屾坊鍔犲紓甯搁�夐」妫�鏌� */
+    async saveSingleConfig(question) {
+      // 妫�鏌ユ槸鍚︽湁寮傚父閫夐」
+      if (!this.checkHasAbnormalOptions(question)) {
+        this.$confirm("璇ラ鐩病鏈夎缃紓甯搁�夐」锛屾槸鍚﹀厛閰嶇疆閫夐」锛�", "鎻愮ず", {
+          confirmButtonText: "鍘婚厤缃�",
+          cancelButtonText: "鍙栨秷",
+          type: "warning",
+        })
+          .then(() => {
+            this.openOptionDialog(question);
+          })
+          .catch(() => {});
+        return;
+      }
+
+      // 鍘熸湁鐨勪繚瀛橀�昏緫...
+      if (!question.hasChanges) return;
+
+      const index = this.filteredQuestionList.findIndex(
+        (q) => q.id === question.id
+      );
+
+      if (index === -1) return;
+
+      const formRef = this.$refs.configForm && this.$refs.configForm[index];
+      if (!formRef) return;
+
+      const valid = await formRef.validate();
+      if (!valid) {
+        this.$message.warning("璇峰厛瀹屾垚蹇呭~椤�");
+        return;
+      }
+
+      // 缁х画鍘熸湁鐨勪繚瀛橀�昏緫...
+      question.saving = true;
+      question.saveStatus = null;
+
+      try {
+        // ... 鍘熸湁鐨勪繚瀛橀�昏緫涓嶅彉
+      } catch (error) {
+        // ... 閿欒澶勭悊涓嶅彉
+      } finally {
+        question.saving = false;
+      }
+    },
+
+    /** 鎵归噺淇濆瓨鏃朵篃瑕佹鏌� */
+    async handleBatchSave() {
+      if (!this.hasChanges || this.batchSaving) return;
+
+      // 妫�鏌ユ墍鏈夋湁鍙樻洿鐨勯鐩槸鍚﹂兘鏈夊紓甯搁�夐」
+      const changedQuestions = this.questionList.filter((q) => q.hasChanges);
+      const questionsWithoutAbnormal = changedQuestions.filter(
+        (q) => !this.checkHasAbnormalOptions(q)
+      );
+
+      if (questionsWithoutAbnormal.length > 0) {
+        this.$confirm(
+          `鏈� ${questionsWithoutAbnormal.length} 涓鐩病鏈夎缃紓甯搁�夐」锛岃鍏堥厤缃�夐」銆傛槸鍚︾户缁紵`,
+          "鎻愮ず",
+          {
+            confirmButtonText: "缁х画",
+            cancelButtonText: "鍘婚厤缃�",
+            type: "warning",
+          }
+        )
+          .then(() => {
+            // 缁х画鎵ц鎵归噺淇濆瓨
+            this.executeBatchSave(changedQuestions);
+          })
+          .catch(() => {
+            // 鍙互鍦ㄨ繖閲岃烦杞埌绗竴涓病鏈夊紓甯搁�夐」鐨勯鐩�
+            if (questionsWithoutAbnormal.length > 0) {
+              this.openOptionDialog(questionsWithoutAbnormal[0]);
+            }
+          });
+      } else {
+        this.executeBatchSave(changedQuestions);
+      }
+    },
+
+    /** 鎵ц鎵归噺淇濆瓨 */
+    async executeBatchSave(changedQuestions) {
+      this.$confirm("纭畾瑕佷繚瀛樻墍鏈変慨鏀硅繃鐨勯厤缃悧锛�", "鎵归噺淇濆瓨", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning",
+      })
+        .then(async () => {
+          this.batchSaving = true;
+
+          const results = [];
+          for (const question of changedQuestions) {
+            try {
+              // 杩欓噷璋冪敤淇敼鍚庣殑saveSingleConfig鏂规硶
+              await this.saveSingleConfig(question);
+              results.push({
+                id: question.id,
+                success:
+                  !question.hasChanges &&
+                  question.saveStatus?.type === "success",
+              });
+            } catch (error) {
+              results.push({
+                id: question.id,
+                success: false,
+              });
+            }
+          }
+
+          this.batchSaving = false;
+          // ... 鍚庣画澶勭悊涓嶅彉
+        })
+        .catch(() => {
+          this.batchSaving = false;
+        });
+    },
+
+    /** 鑾峰彇寮傚父閫夐」缁熻 */
+    getAbnormalStats(question) {
+      if (this.templateForm.templateType === 1) {
+        const options = question.svyLibTemplateTargetoptions || [];
+        return {
+          total: options.length,
+          abnormal: options.filter((opt) => opt.isabnormal === 1).length,
+          warning: options.filter((opt) => opt.isabnormal === 2).length,
+          normal: options.filter((opt) => opt.isabnormal === 0).length,
+        };
+      } else if (this.templateForm.templateType === 2) {
+        const options = question.ivrLibaScriptTargetoptionList || [];
+        return {
+          total: options.length,
+          abnormal: options.filter((opt) => opt.isabnormal === 1).length,
+          warning: options.filter((opt) => opt.isabnormal === 2).length,
+          normal: options.filter((opt) => opt.isabnormal === 0).length,
+        };
+      }
+      return { total: 0, abnormal: 0, warning: 0, normal: 0 };
+    },
     /** 鎼滅储 */
     handleQuery() {
-      this.queryParams.pageNum = 1;
-      this.getQuestionList();
+      // 浠呯瓫閫夋樉绀猴紝涓嶉渶瑕侀噸鏂板姞杞�
     },
 
     /** 閲嶇疆鎼滅储 */
     resetQuery() {
       this.queryParams = {
-        pageNum: 1,
-        pageSize: 10,
         scriptTopic: "",
         scriptContent: "",
-        targetname: "",
-        isavailable: "",
-        categoryids: "404,405,406",
       };
-      this.getQuestionList();
     },
   },
 };
@@ -809,7 +1790,76 @@
     }
   }
 
-  .search-card {
+  .template-section {
+    margin-bottom: 20px;
+
+    .template-header {
+      margin-bottom: 20px;
+
+      .template-title {
+        margin: 0 0 8px 0;
+        font-size: 16px;
+        font-weight: 600;
+        color: #303133;
+      }
+
+      .template-tip {
+        margin: 0;
+        color: #909399;
+        font-size: 13px;
+      }
+    }
+
+    .select-loading {
+      text-align: center;
+      padding: 10px;
+      color: #909399;
+
+      i {
+        margin-right: 8px;
+      }
+    }
+  }
+
+  .template-info-section {
+    margin-bottom: 20px;
+
+    .template-info {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      padding: 5px 0;
+
+      .info-left {
+        .template-name {
+          margin: 0 0 10px 0;
+          font-size: 18px;
+          font-weight: 600;
+          color: #303133;
+        }
+
+        .template-meta {
+          display: flex;
+          gap: 20px;
+          flex-wrap: wrap;
+
+          .meta-item {
+            display: flex;
+            align-items: center;
+            gap: 5px;
+            font-size: 13px;
+            color: #606266;
+
+            i {
+              font-size: 14px;
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .search-section {
     margin-bottom: 20px;
 
     .search-container {
@@ -872,8 +1922,16 @@
     .empty-wrapper {
       min-height: 400px;
       display: flex;
+      flex-direction: column;
       align-items: center;
       justify-content: center;
+
+      .empty-tip {
+        margin-top: 10px;
+        color: #909399;
+        font-size: 13px;
+        text-align: center;
+      }
     }
 
     .question-list {
@@ -982,7 +2040,20 @@
           }
 
           .header-right {
-            flex-shrink: 0;
+            display: flex;
+            flex-direction: column;
+            align-items: flex-end;
+            gap: 8px;
+
+            .option-status {
+              .status-tag {
+                cursor: default;
+
+                i {
+                  margin-right: 4px;
+                }
+              }
+            }
           }
         }
 
@@ -1035,6 +2106,40 @@
               }
             }
 
+            .current-config {
+              margin-bottom: 20px;
+              padding: 15px;
+              background: #f0f9ff;
+              border-radius: 6px;
+              border: 1px solid #d0ebff;
+
+              .config-preview {
+                .preview-item {
+                  display: flex;
+                  align-items: flex-start;
+                  margin-bottom: 8px;
+
+                  &:last-child {
+                    margin-bottom: 0;
+                  }
+
+                  .preview-label {
+                    font-size: 13px;
+                    color: #606266;
+                    font-weight: 500;
+                    min-width: 80px;
+                  }
+
+                  .preview-value {
+                    font-size: 13px;
+                    color: #303133;
+                    line-height: 1.5;
+                    flex: 1;
+                  }
+                }
+              }
+            }
+
             .config-footer {
               display: flex;
               justify-content: space-between;
@@ -1066,15 +2171,6 @@
           }
         }
       }
-    }
-
-    .pagination-wrapper {
-      margin-top: 20px;
-      padding: 20px;
-      background: white;
-      border-radius: 8px;
-      display: flex;
-      justify-content: center;
     }
   }
 
@@ -1151,7 +2247,52 @@
     }
   }
 }
+.option-config-wrapper {
+  .dialog-header {
+    margin-bottom: 20px;
+    padding-bottom: 15px;
+    border-bottom: 1px solid #ebeef5;
 
+    h4 {
+      margin: 0 0 8px 0;
+      color: #303133;
+      font-size: 16px;
+      font-weight: 600;
+    }
+
+    .dialog-subtitle {
+      margin: 0;
+      color: #606266;
+      font-size: 13px;
+      line-height: 1.4;
+    }
+  }
+
+  .option-list {
+    .option-item {
+      margin-bottom: 12px;
+      padding: 12px;
+      background: #f8f9fa;
+      border-radius: 4px;
+      border: 1px solid #ebeef5;
+
+      &:hover {
+        border-color: #dcdfe6;
+      }
+
+      .option-form {
+        .option-index {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          height: 100%;
+          color: #909399;
+          font-weight: 500;
+        }
+      }
+    }
+  }
+}
 @media (max-width: 768px) {
   .satisfaction-exception-config {
     padding: 12px;
@@ -1159,6 +2300,12 @@
     .page-header {
       padding: 16px;
       margin-bottom: 16px;
+    }
+
+    .template-info {
+      flex-direction: column;
+      align-items: flex-start;
+      gap: 10px;
     }
 
     .search-card {
@@ -1205,6 +2352,10 @@
                 gap: 16px;
               }
 
+              .current-config {
+                padding: 12px;
+              }
+
               .config-footer {
                 flex-direction: column;
                 align-items: stretch;
@@ -1220,27 +2371,6 @@
         }
       }
     }
-  }
-}
-</style>
-
-<style lang="scss">
-.config-form {
-  .el-checkbox-group {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 12px;
-  }
-
-  .el-checkbox {
-    margin: 0;
-  }
-}
-
-.option-item {
-  .el-radio__label {
-    display: block;
-    padding-left: 8px;
   }
 }
 </style>

--
Gitblit v1.9.3