From de147dda682f8ac597bbcc8555b57acbdf45dba2 Mon Sep 17 00:00:00 2001
From: WXL (wul) <wl_5969728@163.com>
Date: 星期四, 13 十一月 2025 16:55:51 +0800
Subject: [PATCH] 测试完成
---
src/views/satisfaction.vue | 1188 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 1,188 insertions(+), 0 deletions(-)
diff --git a/src/views/satisfaction.vue b/src/views/satisfaction.vue
new file mode 100644
index 0000000..26585af
--- /dev/null
+++ b/src/views/satisfaction.vue
@@ -0,0 +1,1188 @@
+<template>
+ <div class="questionnaire" :class="'survey-type-' + surveyType">
+ <!-- 鍔犺浇鐘舵�� -->
+ <div v-if="loading" class="loading-state">
+ <div class="loading-spinner">
+ <i class="el-icon-loading"></i>
+ <p>闂嵎鍔犺浇涓�...</p>
+ </div>
+ </div>
+
+ <!-- 鏃犳暟鎹姸鎬� -->
+ <div v-else-if="isEmptyData" class="empty-state">
+ <div class="empty-content">
+ <i class="el-icon-document" style="font-size: 64px; color: #909399"></i>
+ <h3>鏆傛棤闂嵎鏁版嵁</h3>
+ <p>褰撳墠娌℃湁鍙敤鐨勯棶鍗凤紝璇疯仈绯荤鐞嗗憳鎴栫◢鍚庨噸璇�</p>
+ <el-button
+ type="primary"
+ @click="loadSurveyData"
+ icon="el-icon-refresh"
+ >
+ 閲嶆柊鍔犺浇
+ </el-button>
+ </div>
+ </div>
+
+ <!-- 閿欒鐘舵�� -->
+ <div v-else-if="hasError" class="error-state">
+ <div class="error-content">
+ <i class="el-icon-warning" style="font-size: 64px; color: #f56c6c"></i>
+ <h3>鏁版嵁鍔犺浇澶辫触</h3>
+ <p>{{ errorMessage }}</p>
+ <el-button
+ type="primary"
+ @click="loadSurveyData"
+ icon="el-icon-refresh"
+ >
+ 閲嶆柊灏濊瘯
+ </el-button>
+ </div>
+ </div>
+ <div class="CONTENT" v-if="!accomplish">
+ <div class="preview-left">
+ <div class="toptitle">
+ <div class="title">{{ surveyTitle }}</div>
+ <div style="font-size: 22px; margin-bottom: 20px; line-height: 1.5">
+ {{ surveyDescription }}
+ </div>
+ </div>
+ <div v-if="showDeptSelect" class="dept-select-container">
+ <el-form>
+ <el-form>
+ <el-form-item label="閫夋嫨绉戝">
+ <el-select
+ v-model="selectedDept"
+ filterable
+ clearable
+ placeholder="璇烽�夋嫨绉戝鎴栬緭鍏ュ叧閿瘝鎼滅储"
+ @change="handleDeptChange"
+ popper-class="dept-select-dropdown"
+ >
+ <el-option
+ v-for="dept in filteredDeptList"
+ :key="dept.code"
+ :label="`${dept.name} (${dept.code})`"
+ :value="dept.name"
+ >
+ <span>{{ dept.name }}</span>
+ </el-option>
+ </el-select>
+ </el-form-item>
+ </el-form>
+ </el-form>
+ </div>
+ <el-divider></el-divider>
+
+ <!-- 鍗曢�夐 -->
+ <div
+ class="topic-dev"
+ v-for="(item, index) in questionList"
+ :key="item.scriptId"
+ >
+ <div class="scriptTopic-dev" :key="index" v-if="item.scriptType == 1">
+ <div class="dev-text">
+ {{ index + 1 }}銆�<span style="line-height: 1.5"
+ >{{ item.scriptContent }}
+ <span style="color: #3ba2f7">[鍗曢�塢</span></span
+ >
+ </div>
+ <div class="dev-xx">
+ <el-radio-group
+ class="custom-radio"
+ v-model="item.scriptResult"
+ @change="handleOptionChange($event, index, item)"
+ >
+ <el-radio
+ border
+ v-for="(option, optIndex) in item.svyLibTemplateTargetoptions"
+ :class="
+ option.isabnormal &&
+ item.scriptResult == option.optioncontent
+ ? 'red-star'
+ : ''
+ "
+ :key="optIndex"
+ :label="option.optioncontent"
+ >{{ option.optioncontent }}</el-radio
+ >
+ </el-radio-group>
+ </div>
+ <div v-show="item.prompt">
+ <el-alert :title="item.prompt" type="warning"> </el-alert>
+ </div>
+ </div>
+
+ <!-- 澶氶�夐 -->
+ <div class="scriptTopic-dev" :key="index" v-if="item.scriptType == 2">
+ <div class="dev-text">
+ {{ index + 1 }}銆�<span style="line-height: 1.5"
+ >{{ item.scriptContent }}
+ <span style="color: #3ba2f7">[澶氶�塢</span></span
+ >
+ </div>
+ <div class="dev-xx">
+ <el-checkbox-group
+ class="custom-radio"
+ v-model="item.scriptResult"
+ >
+ <el-checkbox
+ border
+ @change="$forceUpdate()"
+ v-for="(option, optIndex) in item.svyLibTemplateTargetoptions"
+ :key="optIndex"
+ :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">
+ <div class="dev-text">
+ {{ index + 1 }}銆�<span style="line-height: 1.5"
+ >{{ item.scriptContent
+ }}<span style="color: #3ba2f7">[闂瓟]</span></span
+ >
+ </div>
+ <div class="dev-xx">
+ <el-input
+ type="textarea"
+ :rows="3"
+ placeholder="璇疯緭鍏�"
+ v-model="item.scriptResult"
+ clearable
+ >
+ </el-input>
+ </div>
+ </div>
+ </div>
+
+ <div class="bottom-fixed">
+ <el-button
+ type="primary"
+ style="width: 80%; font-size: 20px"
+ @click="submitSurvey"
+ >鎻愪氦闂嵎</el-button
+ >
+ </div>
+ </div>
+ </div>
+
+ <div class="CONTENT" v-else>
+ <div class="preview-lefts">
+ <div class="completion-message">
+ <div class="thank-you">{{ this.accomplish || "鎰熻阿鎮ㄧ殑閰嶅悎!" }}</div>
+ <div class="feedback-message">{{ completionMessage }}</div>
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+import {
+ getScriptByCondition,
+ saveMYDQuestionAnswer,
+ WLgetDept,
+} from "@/api/AiCentre/index";
+
+export default {
+ data() {
+ return {
+ surveyType: null, // 'outpatient', 'inpatient'
+ surveyTitle: "",
+ surveyDescription: "",
+ questionList: [],
+ deptList: [],
+ completionMessage: "",
+ accomplish: false,
+ showDeptSelect: false,
+ selectedDept: null,
+ deptSearchText: "", // 淇濈暀鐢ㄤ簬鏈湴杩囨护
+ deptList: [],
+ filteredDeptList: [],
+
+ // 鍔犲瘑鍚庣殑鍙傛暟
+ encryptedParams: {
+ param1: "",
+ param2: "",
+ param3: "",
+ param4: "",
+ param5: "",
+ param6: "30001002",
+ },
+ isEmptyData: false, // 鏂板锛氭棤鏁版嵁鐘舵��
+ hasError: false, // 鏂板锛氶敊璇姸鎬�
+ loading: false, // 鏂板锛氬姞杞界姸鎬�
+ errorMessage: "", // 鏂板锛氶敊璇俊鎭�
+ // 娴嬭瘯鏁版嵁
+ testData: {
+ 1: {
+ title: "闂ㄨ瘖婊℃剰搴﹁皟鏌�",
+ description:
+ "浜茬埍鐨勬偅鑰咃紝鎰熻阿鎮ㄩ�夋嫨鎴戜滑鐨勫尰鐤楁湇鍔°�備负浜嗕笉鏂彁鍗囨湇鍔¤川閲忥紝璇锋偍鑺卞嚑鍒嗛挓鏃堕棿濉啓姝ら棶鍗枫��",
+ questions: [
+ {
+ scriptId: 1,
+ scriptType: 1,
+ scriptContent: "鎮ㄥ闂ㄨ瘖鍖荤敓鐨勮瘖鐤楁按骞虫槸鍚︽弧鎰忥紵",
+ scriptResult: null,
+ svyLibTemplateTargetoptions: [
+ { optioncontent: "闈炲父婊℃剰", value: "5", isabnormal: false },
+ { optioncontent: "婊℃剰", value: "4", isabnormal: false },
+ { optioncontent: "涓�鑸�", value: "3", isabnormal: true },
+ { optioncontent: "涓嶆弧鎰�", value: "2", isabnormal: true },
+ { optioncontent: "闈炲父涓嶆弧鎰�", value: "1", isabnormal: true },
+ ],
+ },
+ {
+ scriptId: 2,
+ scriptType: 1,
+ scriptContent: "鎮ㄥ闂ㄨ瘖鎶ゅ＋鐨勬湇鍔℃�佸害鏄惁婊℃剰锛�",
+ scriptResult: null,
+ svyLibTemplateTargetoptions: [
+ { optioncontent: "闈炲父婊℃剰", value: "5", isabnormal: false },
+ { optioncontent: "婊℃剰", value: "4", isabnormal: false },
+ { optioncontent: "涓�鑸�", value: "3", isabnormal: true },
+ { optioncontent: "涓嶆弧鎰�", value: "2", isabnormal: true },
+ { optioncontent: "闈炲父涓嶆弧鎰�", value: "1", isabnormal: true },
+ ],
+ },
+ {
+ scriptId: 3,
+ scriptType: 2,
+ scriptContent: "鎮ㄨ涓洪棬璇婂摢浜涙柟闈㈤渶瑕佹敼杩涳紵锛堝彲澶氶�夛級",
+ scriptResult: [],
+ svyLibTemplateTargetoptions: [
+ {
+ optioncontent: "鎺掗槦绛夊�欐椂闂�",
+ value: "waiting_time",
+ isabnormal: false,
+ },
+ {
+ optioncontent: "鍖荤敓娌熼�氭柟寮�",
+ value: "communication",
+ isabnormal: false,
+ },
+ {
+ optioncontent: "灏辫瘖鐜",
+ value: "environment",
+ isabnormal: false,
+ },
+ {
+ optioncontent: "鍖荤枟璁惧",
+ value: "equipment",
+ isabnormal: false,
+ },
+ { optioncontent: "鍏朵粬", value: "other", isabnormal: false },
+ ],
+ },
+ {
+ scriptId: 4,
+ scriptType: 4,
+ scriptContent: "鎮ㄥ闂ㄨ瘖鏈嶅姟杩樻湁浠�涔堝叾浠栧缓璁紵",
+ scriptResult: null,
+ },
+ ],
+ completionMessage:
+ "鎰熻阿鎮ㄥ疂璐电殑鎰忚锛佹垜浠皢涓嶆柇鏀硅繘闂ㄨ瘖鏈嶅姟璐ㄩ噺锛屼负鎮ㄦ彁渚涙洿濂界殑鍖荤枟鏈嶅姟浣撻獙銆�",
+ },
+ 2: {
+ title: "浣忛櫌婊℃剰搴﹁皟鏌�",
+ description:
+ "浜茬埍鐨勬偅鑰呭強瀹跺睘锛屾劅璋㈡偍閫夋嫨鍦ㄦ垜闄綇闄㈡不鐤椼�備负浜嗘彁鍗囦綇闄㈡湇鍔¤川閲忥紝璇锋偍濉啓姝ら棶鍗枫��",
+ questions: [
+ {
+ scriptId: 1,
+ scriptType: 1,
+ scriptContent: "鎮ㄥ浣忛櫌鏈熼棿鍖荤敓鐨勮瘖鐤楁按骞虫槸鍚︽弧鎰忥紵",
+ scriptResult: null,
+ svyLibTemplateTargetoptions: [
+ { optioncontent: "闈炲父婊℃剰", value: "5", isabnormal: false },
+ { optioncontent: "婊℃剰", value: "4", isabnormal: false },
+ { optioncontent: "涓�鑸�", value: "3", isabnormal: true },
+ { optioncontent: "涓嶆弧鎰�", value: "2", isabnormal: true },
+ { optioncontent: "闈炲父涓嶆弧鎰�", value: "1", isabnormal: true },
+ ],
+ },
+ {
+ scriptId: 2,
+ scriptType: 1,
+ scriptContent: "鎮ㄥ浣忛櫌鏈熼棿鎶ゅ＋鐨勬姢鐞嗘湇鍔℃槸鍚︽弧鎰忥紵",
+ scriptResult: null,
+ svyLibTemplateTargetoptions: [
+ { optioncontent: "闈炲父婊℃剰", value: "5", isabnormal: false },
+ { optioncontent: "婊℃剰", value: "4", isabnormal: false },
+ { optioncontent: "涓�鑸�", value: "3", isabnormal: true },
+ { optioncontent: "涓嶆弧鎰�", value: "2", isabnormal: true },
+ { optioncontent: "闈炲父涓嶆弧鎰�", value: "1", isabnormal: true },
+ ],
+ },
+ {
+ scriptId: 3,
+ scriptType: 1,
+ scriptContent: "鎮ㄥ浣忛櫌鐥呮埧鐨勭幆澧冨拰鍗敓鏄惁婊℃剰锛�",
+ scriptResult: null,
+ svyLibTemplateTargetoptions: [
+ { optioncontent: "闈炲父婊℃剰", value: "5", isabnormal: false },
+ { optioncontent: "婊℃剰", value: "4", isabnormal: false },
+ { optioncontent: "涓�鑸�", value: "3", isabnormal: true },
+ { optioncontent: "涓嶆弧鎰�", value: "2", isabnormal: true },
+ { optioncontent: "闈炲父涓嶆弧鎰�", value: "1", isabnormal: true },
+ ],
+ },
+ {
+ scriptId: 4,
+ scriptType: 4,
+ scriptContent: "鎮ㄥ浣忛櫌鏈嶅姟杩樻湁浠�涔堝叾浠栧缓璁紵",
+ scriptResult: null,
+ },
+ ],
+ completionMessage:
+ "鎰熻阿鎮ㄥ鎴戜滑宸ヤ綔鐨勬敮鎸侊紒鎴戜滑灏嗘牴鎹偍鐨勫弽棣堟寔缁敼杩涗綇闄㈡湇鍔¤川閲忥紝绁濇偍鏃╂棩搴峰锛�",
+ },
+ },
+ };
+ },
+ created() {
+ this.initSurveyData();
+ },
+ methods: {
+ // 鍒濆鍖栬皟鏌ユ暟鎹�
+ initSurveyData() {
+ // 浠庤矾鐢卞弬鏁拌幏鍙栧姞瀵嗗悗鐨勫弬鏁�
+ this.encryptedParams.param1 =
+ this.$route.query.param1 ||
+ "WOAq2QZd43E-qg-96SvuIFsn-sdRVxQNH4M82XhpXp_Ux4PFrPaqSFXcKaeA6oxEgNhPisA86LvU9kTAEz4xvQ==";
+ this.encryptedParams.param2 =
+ this.$route.query.param2 ||
+ "XWeBh42RLYlNsMcomgw9UXhUPySkRP5EneWSueSq8F84qwYznU9heXuSx4tUMUtDvRnuJ86moJivy-kWQX12Rg==";
+ this.encryptedParams.param5 = this.$route.query.param3 || "2"; // 1=浣忛櫌, 2=闂ㄨ瘖, 3=鎶曡瘔寤鸿
+ this.encryptedParams.param6 = this.$route.query.param4 || "30001002";
+
+ this.surveyType = parseInt(this.encryptedParams.param5) || 2;
+
+ // 鍔犺浇闂嵎鏁版嵁
+ this.loadSurveyData();
+ // 鑾峰彇绉戝鍒楄〃
+ this.WLgetDept();
+ },
+ WLgetDept() {
+ // 璋冪敤鎺ュ彛鑾峰彇绉戝鏁版嵁
+ WLgetDept(this.encryptedParams.param6).then((res) => {
+ this.deptList = Object.entries(res.data).map(([code, name]) => ({
+ code,
+ name,
+ }));
+ this.filteredDeptList = [...this.deptList];
+
+ if (this.surveyType === 3) {
+ this.showDeptSelect = true;
+ }
+ });
+ },
+ filterDeptList() {
+ if (!this.deptSearchText) {
+ this.filteredDeptList = [...this.deptList];
+ return;
+ }
+
+ const searchText = this.deptSearchText.toLowerCase();
+ this.filteredDeptList = this.deptList.filter(
+ (dept) =>
+ dept.name.toLowerCase().includes(searchText) ||
+ dept.code.toLowerCase().includes(searchText)
+ );
+ },
+ // 鍔犺浇璋冩煡鏁版嵁
+ loadSurveyData() {
+ this.loading = true;
+ this.isEmptyData = false;
+ this.hasError = false;
+ this.errorMessage = "";
+ // 璋冪敤鎺ュ彛鑾峰彇闂嵎鏁版嵁
+ // 鏍规嵁闂嵎绫诲瀷璁剧疆涓嶅悓鐨勫弬鏁�
+ let encryptedParams = {
+ param1: this.encryptedParams.param1,
+ };
+
+ // 鏍规嵁surveyType璁剧疆涓嶅悓鐨勫弬鏁�
+ switch (this.surveyType) {
+ case 1: // 浣忛櫌
+ encryptedParams.param2 = this.encryptedParams.param2;
+ break;
+ case 2: // 闂ㄨ瘖
+ encryptedParams.param3 = this.encryptedParams.param2;
+ break;
+ case 3: // 鎶曡瘔寤鸿
+ encryptedParams.param4 = this.encryptedParams.param2;
+ break;
+ default:
+ encryptedParams.param3 = this.encryptedParams.param2;
+ }
+ getScriptByCondition(encryptedParams)
+ .then((res) => {
+ if (res.code === 200) {
+ if (res.data.result) {
+ this.accomplish = res.data.result;
+ return;
+ }
+ if (
+ !res.data.svyLibTemplateScriptVOS ||
+ res.data.svyLibTemplateScriptVOS.length === 0
+ ) {
+ this.isEmptyData = true;
+ this.$message.warning("鏆傛棤闂嵎鏁版嵁");
+ return;
+ }
+ // 澶勭悊鎺ュ彛杩斿洖鐨勬暟鎹�
+ this.questionList = res.data.svyLibTemplateScriptVOS.map((item) => {
+ return {
+ ...item,
+ scriptResult: item.scriptType === 2 ? [] : null,
+ };
+ });
+
+ // 鏍规嵁surveyType璁剧疆鏍囬鍜屾弿杩�
+ switch (this.surveyType) {
+ case 2: // 闂ㄨ瘖
+ this.surveyTitle = "闂ㄨ瘖婊℃剰搴﹁皟鏌�";
+ this.surveyDescription =
+ "浜茬埍鐨勬偅鑰咃紝鎰熻阿鎮ㄩ�夋嫨鎴戜滑鐨勫尰鐤楁湇鍔°�備负浜嗕笉鏂彁鍗囨湇鍔¤川閲忥紝璇锋偍鑺卞嚑鍒嗛挓鏃堕棿濉啓姝ら棶鍗枫��";
+ this.completionMessage =
+ "鎰熻阿鎮ㄥ疂璐电殑鎰忚锛佹垜浠皢涓嶆柇鏀硅繘闂ㄨ瘖鏈嶅姟璐ㄩ噺锛屼负鎮ㄦ彁渚涙洿濂界殑鍖荤枟鏈嶅姟浣撻獙銆�";
+ break;
+ case 1: // 浣忛櫌
+ this.surveyTitle = "浣忛櫌婊℃剰搴﹁皟鏌�";
+ this.surveyDescription =
+ "浜茬埍鐨勬偅鑰呭強瀹跺睘锛屾劅璋㈡偍閫夋嫨鍦ㄦ垜闄綇闄㈡不鐤椼�備负浜嗘彁鍗囦綇闄㈡湇鍔¤川閲忥紝璇锋偍濉啓姝ら棶鍗枫��";
+ this.completionMessage =
+ "鎰熻阿鎮ㄥ鎴戜滑宸ヤ綔鐨勬敮鎸侊紒鎴戜滑灏嗘牴鎹偍鐨勫弽棣堟寔缁敼杩涗綇闄㈡湇鍔¤川閲忥紝绁濇偍鏃╂棩搴峰锛�";
+ break;
+ case 3: // 鎶曡瘔寤鸿
+ this.surveyTitle = "鎶曡瘔寤鸿鍙嶉";
+ this.surveyDescription =
+ "灏婃暚鐨勫鎴凤紝鎰熻阿鎮ㄦ娊鍑哄疂璐垫椂闂存彁渚涘弽棣堛�傛偍鐨勬剰瑙佸鎴戜滑鏀硅繘鏈嶅姟闈炲父閲嶈銆�";
+ this.completionMessage =
+ "鎰熻阿鎮ㄧ殑鍙嶉锛佹垜浠凡鏀跺埌鎮ㄧ殑鎶曡瘔/寤鸿锛屽皢灏藉揩澶勭悊骞朵笌鎮ㄨ仈绯汇��";
+ break;
+ default:
+ this.useTestData(1); // 榛樿浣跨敤闂ㄨ瘖鏁版嵁
+ }
+ } else {
+ // 鎺ュ彛鏃犳暟鎹垨澶辫触锛屼娇鐢ㄦ祴璇曟暟鎹�
+ // this.useTestData(this.surveyType);
+ }
+ })
+ .catch(() => {
+ console.error("鏁版嵁鑾峰彇澶辫触:", error);
+ this.hasError = true;
+ this.errorMessage =
+ error.message || "闂嵎鏁版嵁鍔犺浇澶辫触锛岃妫�鏌ョ綉缁滆繛鎺ュ悗閲嶈瘯";
+ this.$message.error("鏁版嵁鍔犺浇澶辫触");
+ // 鎺ュ彛璋冪敤澶辫触锛屼娇鐢ㄦ祴璇曟暟鎹�
+ // this.useTestData(this.surveyType);
+ })
+ .finally(() => {
+ this.loading = false;
+ });
+ },
+ handleDeptChange(value) {
+ this.selectedDept = value;
+ // 鍙互鍦ㄨ繖閲屾坊鍔犲叾浠栧鐞嗛�昏緫
+ },
+ // 浣跨敤娴嬭瘯鏁版嵁
+ useTestData(surveyType) {
+ const type = [1, 2, 3].includes(surveyType) ? surveyType : 1;
+ const testData = this.testData[type];
+
+ this.surveyTitle = testData.title;
+ this.surveyDescription = testData.description;
+ this.questionList = testData.questions;
+ this.completionMessage = testData.completionMessage;
+ },
+
+ // 鎻愪氦璋冩煡闂嵎锛堢洿鎺ユ彁浜わ紝涓嶇粡杩囩紦瀛橈級
+ async submitSurvey() {
+ // 楠岃瘉蹇呭～椤�
+ if (this.hasUnansweredRequiredQuestions()) {
+ this.$message.error("璇峰畬鎴愭墍鏈夊繀濉棶棰樺悗鍐嶆彁浜�");
+ return;
+ }
+
+ try {
+ const submitData = this.prepareSubmitData();
+ const res = await saveMYDQuestionAnswer(submitData);
+
+ if (res.code === 200) {
+ this.accomplish = "闂嵎宸叉彁浜�";
+ this.$message.success("鎻愪氦鎴愬姛锛佹劅璋㈡偍鐨勫弽棣堛��");
+ } else {
+ this.$message.error(res.msg || "鎻愪氦澶辫触锛岃绋嶅悗鍐嶈瘯");
+ }
+ } catch (error) {
+ this.$message.error("缃戠粶閿欒锛屾彁浜ゅけ璐�");
+ console.error("鎻愪氦澶辫触:", error);
+ }
+ },
+
+ // 妫�鏌ユ槸鍚︽湁鏈洖绛旂殑蹇呭～闂
+ hasUnansweredRequiredQuestions() {
+ return this.questionList.some((question) => {
+ return (
+ question.required &&
+ (question.scriptResult === null ||
+ question.scriptResult === "" ||
+ (Array.isArray(question.scriptResult) &&
+ question.scriptResult.length === 0))
+ );
+ });
+ },
+
+ // 鍑嗗鎻愪氦鏁版嵁
+ prepareSubmitData() {
+ // 鍒涘缓绉戝閫夋嫨闂瀵硅薄
+ const deptQuestion = {
+ scriptId: "dept_selection", // 鑷畾涔塈D
+ scriptType: 4, // 4琛ㄧず闂瓟绫诲瀷
+ scriptContent: "閫夋嫨鐨勭瀹�",
+ scriptResult: this.selectedDept || "", // 瀛樺偍閫夋嫨鐨勭瀹ゅ悕绉�
+ required: false, // 闈炲繀濉�
+ sort: 999,
+ nextScriptno: "1",
+ };
+
+ return {
+ taskId: this.encryptedParams.param1,
+ serialnum: this.encryptedParams.param2 || this.encryptedParams.param3,
+ mzzy: this.surveyType,
+ svyLibTemplateScriptVOS: [
+ deptQuestion, // 灏嗙瀹ら�夋嫨浣滀负绗竴涓棶棰�
+ ...this.questionList.map((item) => {
+ return {
+ scriptId: item.scriptId,
+ scriptType: item.scriptType,
+ scriptResult:
+ item.scriptType === 2
+ ? (item.scriptResult || []).join("&")
+ : item.scriptResult || "",
+ nextScriptno: item.nextScriptno,
+ score: item.score,
+ prompt: item.prompt,
+ ...item,
+ };
+ }),
+ ],
+ excep: this.checkAbnormalOptions() ? 1 : 0,
+ };
+ },
+
+ // 妫�鏌ュ紓甯搁�夐」
+ checkAbnormalOptions() {
+ return this.questionList.some((question) => {
+ if (!question.scriptResult) return false;
+
+ if (question.scriptType === 1) {
+ // 鍗曢�夐寮傚父妫�鏌�
+ const selectedOption = question.svyLibTemplateTargetoptions.find(
+ (opt) => opt.optioncontent === question.scriptResult
+ );
+ return selectedOption?.isabnormal;
+ } else if (question.scriptType === 2) {
+ // 澶氶�夐寮傚父妫�鏌�
+ return question.scriptResult.some((answer) => {
+ const option = question.svyLibTemplateTargetoptions.find(
+ (opt) => opt.optioncontent === answer
+ );
+ return option?.isabnormal;
+ });
+ }
+ return false;
+ });
+ },
+
+ // 澶勭悊鍗曢�夐�夐」鍙樺寲
+ handleOptionChange(selectedValue, index, question) {
+ const selectedOption = question.svyLibTemplateTargetoptions.find(
+ (option) => option.optioncontent === selectedValue
+ );
+
+ if (selectedOption) {
+ this.questionList[index].nextScriptno = selectedOption.nextQuestion;
+ this.questionList[index].score = selectedOption.score;
+ this.questionList[index].prompt = selectedOption.prompt;
+ }
+ },
+ },
+};
+</script>
+
+<style lang="scss" scoped>
+/* 鍩虹鏍峰紡鍙橀噺 */
+:root {
+ --primary-color: #1a73e8; /* 榛樿钃濊壊 */
+ --secondary-color: #34d399; /* 榛樿缁胯壊 */
+ --alert-color: #ed8936; /* 榛樿姗欒壊 */
+}
+
+/* 闂ㄨ瘖鏍峰紡鍙橀噺 */
+.survey-type-1 {
+ --primary-color: #1a73e8; /* 鍖荤枟钃� */
+ --secondary-color: #34d399; /* 鍋ュ悍缁� */
+ --alert-color: #ed8936; /* 璀︾ず姗� */
+}
+
+/* 浣忛櫌鏍峰紡鍙橀噺 */
+.survey-type-2 {
+ --primary-color: #5a67d8; /* 娣辫摑绱� */
+ --secondary-color: #667eea; /* 娴呰摑绱� */
+ --alert-color: #f56565; /* 璀︾ず绾� */
+}
+
+/* 鎶曡瘔寤鸿鏍峰紡鍙橀噺 */
+.survey-type-3 {
+ --primary-color: #e53e3e; /* 绱ф�ョ孩 */
+ --secondary-color: #f6ad55; /* 璀︾ず榛� */
+ --alert-color: #f56565; /* 璀︾ず绾� */
+}
+
+.questionnaire {
+ font-family: "PingFang SC", "Helvetica Neue", Arial, sans-serif;
+ min-height: 100vh;
+ margin: 0;
+ padding: 0;
+ color: #333;
+ transition: all 0.3s ease;
+
+ /* 鏍规嵁surveyType搴旂敤涓嶅悓鐨勪富棰� */
+ &.survey-type-1 {
+ background-color: #f5f9fc;
+ --theme-gradient: linear-gradient(135deg, #1a73e8, #34d399);
+ }
+
+ &.survey-type-2 {
+ background-color: #f8f9ff;
+ --theme-gradient: linear-gradient(135deg, #5a67d8, #667eea);
+ }
+
+ &.survey-type-3 {
+ background-color: #fff5f5;
+ --theme-gradient: linear-gradient(135deg, #e53e3e, #f6ad55);
+ }
+}
+.dept-select-container {
+ margin: 20px 0;
+ padding: 20px;
+ background-color: #f8fafc;
+ border-radius: 8px;
+ border: 1px solid #e2e8f0;
+}
+
+/* 璋冩暣涓嬫媺閫夐」鏍峰紡 */
+.el-select-dropdown__item {
+ display: flex;
+ justify-content: space-between;
+}
+/* 涓嬫媺妗嗘牱寮忚皟鏁� */
+::v-deep .dept-select-dropdown {
+ max-height: 400px; /* 闄愬埗鏈�澶ч珮搴� */
+ overflow-y: auto; /* 娣诲姞婊氬姩鏉� */
+
+ .el-select-dropdown__item {
+ display: flex;
+ justify-content: space-between;
+ padding: 0 20px;
+ height: auto;
+ line-height: 36px;
+
+ span {
+ display: inline-block;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+
+ /* 鍚嶇О閮ㄥ垎 */
+ span:first-child {
+ width: 60%;
+ text-align: left;
+ }
+
+ /* 缂栫爜閮ㄥ垎 */
+ span:last-child {
+ width: 40%;
+ text-align: right;
+ }
+ }
+}
+
+/* 绉诲姩绔�傞厤 */
+@media (max-width: 768px) {
+ ::v-deep .dept-select-dropdown {
+ max-width: 100vw; /* 闄愬埗鏈�澶у搴︿负瑙嗗彛瀹藉害 */
+ width: auto !important;
+ left: 10px !important;
+ right: 10px !important;
+
+ .el-select-dropdown__item {
+ span:first-child {
+ width: 50%;
+ }
+ span:last-child {
+ width: 50%;
+ }
+ }
+ }
+}
+.CONTENT {
+ max-width: 900px;
+ margin: 0 auto;
+ padding: 20px;
+
+ .title {
+ color: var(--primary-color);
+ font-size: 28px;
+ font-weight: 600;
+ margin-bottom: 15px;
+ text-align: center;
+ letter-spacing: 0.5px;
+ position: relative;
+
+ &::after {
+ content: "";
+ position: absolute;
+ bottom: -8px;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 60px;
+ height: 3px;
+ background: var(--theme-gradient);
+ border-radius: 3px;
+ }
+ }
+}
+
+.preview-left {
+ margin: 20px 0;
+ margin-bottom: 100px;
+ background-color: #fff;
+ border-radius: 12px;
+ padding: 30px;
+ border: none;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
+ transition: all 0.3s ease;
+
+ &:hover {
+ box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
+ }
+
+ .toptitle {
+ margin-bottom: 25px;
+
+ div {
+ color: #4a5568;
+ font-size: 18px;
+ line-height: 1.6;
+ text-align: center;
+ }
+ }
+
+ .el-divider {
+ background-color: #e2e8f0;
+ margin: 25px 0;
+ }
+
+ .topic-dev {
+ margin-bottom: 30px;
+ font-size: 17px;
+ background-color: #f8fafc;
+ border-radius: 10px;
+ padding: 20px;
+ transition: all 0.3s ease;
+ position: relative;
+ overflow: hidden;
+
+ &:hover {
+ background-color: #f1f5f9;
+ }
+
+ /* 娣诲姞绫诲瀷鏍囪瘑灏忔爣绛� */
+ &::before {
+ content: "";
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 4px;
+ height: 100%;
+ background: var(--primary-color);
+ }
+
+ .dev-text {
+ margin-bottom: 18px;
+ font-weight: 500;
+ color: #2d3748;
+ font-size: 18px;
+ line-height: 1.6;
+
+ span[style*="color: #3ba2f7"] {
+ font-size: 14px;
+ margin-left: 8px;
+ color: var(--primary-color) !important;
+ }
+ }
+ }
+}
+
+.preview-lefts {
+ margin: 20px 0;
+ background-color: #fff;
+ border-radius: 12px;
+ padding: 40px;
+ min-height: 400px;
+ border: none;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ text-align: center;
+
+ .completion-message {
+ padding: 40px;
+ max-width: 600px;
+
+ .thank-you {
+ font-size: 32px;
+ color: var(--primary-color);
+ font-weight: 600;
+ margin-bottom: 25px;
+ position: relative;
+ display: inline-block;
+
+ &::after {
+ content: "";
+ position: absolute;
+ bottom: -10px;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 80px;
+ height: 3px;
+ background: var(--theme-gradient);
+ border-radius: 3px;
+ }
+ }
+
+ .feedback-message {
+ font-size: 20px;
+ line-height: 1.7;
+ color: #4a5568;
+ margin: 0 auto;
+ }
+ }
+}
+
+.red-star {
+ ::v-deep .el-radio__label,
+ ::v-deep .el-checkbox__label {
+ position: relative;
+ padding-right: 20px;
+
+ &::after {
+ content: "*";
+ color: #ef4444;
+ position: absolute;
+ right: 0;
+ top: 0;
+ font-size: 16px;
+ }
+ }
+}
+.loading-state {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ min-height: 60vh;
+ padding: 40px;
+
+ .loading-spinner {
+ text-align: center;
+
+ .el-icon-loading {
+ font-size: 48px;
+ color: var(--primary-color);
+ margin-bottom: 16px;
+ animation: rotating 2s linear infinite;
+ }
+
+ p {
+ color: #666;
+ font-size: 16px;
+ }
+ }
+}
+
+.empty-state,
+.error-state {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ min-height: 60vh;
+ padding: 40px;
+
+ .empty-content,
+ .error-content {
+ text-align: center;
+ max-width: 400px;
+
+ h3 {
+ color: #666;
+ font-size: 20px;
+ margin: 16px 0 12px;
+ font-weight: 500;
+ }
+
+ p {
+ color: #999;
+ font-size: 14px;
+ margin-bottom: 24px;
+ line-height: 1.6;
+ }
+ }
+}
+
+.error-state {
+ .error-content {
+ h3 {
+ color: #f56c6c;
+ }
+ }
+}
+
+@keyframes rotating {
+ from {
+ transform: rotate(0deg);
+ }
+ to {
+ transform: rotate(360deg);
+ }
+}
+
+/* 鍝嶅簲寮忚皟鏁� */
+@media (max-width: 768px) {
+ .loading-state,
+ .empty-state,
+ .error-state {
+ padding: 20px;
+ min-height: 50vh;
+
+ .el-icon-loading,
+ .el-icon-document,
+ .el-icon-warning {
+ font-size: 40px !important;
+ }
+
+ h3 {
+ font-size: 18px !important;
+ }
+
+ p {
+ font-size: 13px !important;
+ }
+ }
+}
+::v-deep {
+ .el-checkbox-group {
+ display: flex;
+ flex-direction: column;
+ margin: 15px 0;
+ gap: 12px;
+ }
+
+ .el-radio-group {
+ display: flex;
+ flex-direction: column;
+ margin: 15px 0;
+ gap: 12px;
+ }
+
+ .el-radio.is-bordered,
+ .el-checkbox.is-bordered {
+ width: 100%;
+ margin-right: 0;
+ margin-bottom: 10px;
+ max-width: 400px;
+ padding: 14px 20px 14px 15px;
+ border-radius: 8px;
+ height: auto;
+ min-height: 50px;
+ border: 1px solid #e2e8f0;
+ transition: all 0.3s ease;
+ margin-left: 0 !important;
+ margin-top: 0 !important;
+ .el-radio-group,
+ .el-checkbox-group {
+ align-items: center;
+ }
+ &:hover {
+ border-color: var(--primary-color);
+ box-shadow: 0 2px 8px rgba(var(--primary-color), 0.15);
+ }
+
+ &.is-checked {
+ border-color: var(--primary-color);
+ background-color: rgba(var(--primary-color), 0.05);
+ }
+ }
+
+ .el-radio__label,
+ .el-checkbox__label {
+ font-size: 16px;
+ color: #2d3748;
+ }
+
+ .el-alert--warning.is-light {
+ background-color: #fff8f0;
+ color: var(--alert-color);
+ margin-top: 15px;
+ border-radius: 8px;
+ border-left: 4px solid var(--alert-color);
+
+ .el-alert__title {
+ font-size: 15px;
+ line-height: 1.6;
+ color: var(--alert-color);
+ }
+
+ .el-alert__closebtn {
+ color: var(--alert-color);
+ }
+ }
+
+ .el-textarea__inner {
+ font-size: 16px;
+ border-radius: 8px;
+ border: 1px solid #e2e8f0;
+ padding: 12px 15px;
+ transition: all 0.3s ease;
+ min-height: 100px;
+
+ &:focus {
+ border-color: var(--primary-color);
+ box-shadow: 0 0 0 2px rgba(var(--primary-color), 0.2);
+ }
+
+ &::placeholder {
+ color: #a0aec0;
+ }
+ }
+
+ .el-radio__input.is-checked .el-radio__inner {
+ background-color: var(--primary-color);
+ border-color: var(--primary-color);
+ }
+
+ .el-checkbox__input.is-checked .el-checkbox__inner {
+ background-color: var(--primary-color);
+ border-color: var(--primary-color);
+ }
+
+ .el-radio__inner,
+ .el-checkbox__inner {
+ width: 18px;
+ height: 18px;
+ }
+}
+
+.bottom-fixed {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ text-align: center;
+ padding: 10px 0;
+ background: var(--theme-gradient);
+ box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.1);
+ z-index: 1000;
+ transition: all 0.3s ease;
+
+ .el-button {
+ height: 56px;
+ font-size: 18px;
+ font-weight: 500;
+ letter-spacing: 0.5px;
+ border-radius: 8px;
+ background-color: #fff;
+ color: var(--primary-color);
+ border: none;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+ transition: all 0.3s ease;
+ width: 80%;
+ max-width: 400px;
+ position: relative;
+ overflow: hidden;
+
+ &::before {
+ content: "";
+ position: absolute;
+ top: 0;
+ left: -100%;
+ width: 100%;
+ height: 100%;
+ background: linear-gradient(
+ 90deg,
+ transparent,
+ rgba(255, 255, 255, 0.4),
+ transparent
+ );
+ transition: all 0.5s ease;
+ }
+
+ &:hover {
+ transform: translateY(-2px);
+ box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
+
+ &::before {
+ left: 100%;
+ }
+ }
+
+ &:active {
+ transform: translateY(0);
+ }
+ }
+}
+
+/* 鍝嶅簲寮忚璁� */
+@media (max-width: 768px) {
+ .questionnaire {
+ .CONTENT {
+ padding: 15px;
+ }
+
+ .preview-left,
+ .preview-lefts {
+ padding: 20px;
+ margin-bottom: 80px;
+ }
+
+ .title {
+ font-size: 24px !important;
+ }
+
+ .dev-text {
+ font-size: 16px !important;
+ }
+
+ .bottom-fixed .el-button {
+ height: 50px;
+ font-size: 16px;
+ width: 90%;
+ }
+ }
+}
+</style>
--
Gitblit v1.9.3