From c8a3df8ef73d08de60ca49e09a343e87bcc66a91 Mon Sep 17 00:00:00 2001
From: wlzboy <66905212@qq.com>
Date: 星期六, 27 九月 2025 22:01:56 +0800
Subject: [PATCH] fix:修改配置
---
ruoyi-ui/src/views/evaluation/index.vue | 150 +++++++++++++++++++++++++++++++++++++++++++++----
1 files changed, 136 insertions(+), 14 deletions(-)
diff --git a/ruoyi-ui/src/views/evaluation/index.vue b/ruoyi-ui/src/views/evaluation/index.vue
index d4db6f1..e0fae2a 100644
--- a/ruoyi-ui/src/views/evaluation/index.vue
+++ b/ruoyi-ui/src/views/evaluation/index.vue
@@ -3,7 +3,7 @@
<!-- 椤甸潰澶撮儴 -->
<div class="evaluation-header">
<h1>鏈嶅姟璇勪环</h1>
- <p>鎰熻阿鎮ㄤ娇鐢ㄦ垜浠殑鏈嶅姟锛岃瀵规湰娆℃湇鍔¤繘琛岃瘎浠�</p>
+ <p>鎰熻阿鎮ㄤ娇鐢ㄦ垜浠殑闈�120鎬ユ晳鍖荤枟杞繍鏈嶅姟锛岃瀵规湰娆℃湇鍔¤繘琛岃瘎浠凤紒</p>
</div>
<!-- 杞﹁締淇℃伅 -->
@@ -19,7 +19,7 @@
<el-form ref="evaluationForm" :model="evaluationForm" :rules="rules" label-width="80px" size="small">
<!-- 瀹㈡埛淇℃伅 -->
<div class="form-section">
- <h3>瀹㈡埛淇℃伅</h3>
+ <h3>瀹㈡埛淇℃伅:</h3>
<!-- 寰俊鎺堟潈淇℃伅鏄剧ず -->
<div v-if="evaluationForm.wechatOpenid" class="wechat-info">
@@ -46,14 +46,13 @@
<div class="wechat-tip">鐐瑰嚮鍙嚜鍔ㄨ幏鍙栨偍鐨勫井淇′俊鎭�</div>
</div>
- <el-form-item label="濮撳悕" prop="customerName">
+ <el-form-item label="绉板懠" prop="customerName">
<el-input v-model="evaluationForm.customerName" placeholder="璇疯緭鍏ユ偍鐨勫鍚�" />
</el-form-item>
<el-form-item label="鎵嬫満鍙�" prop="customerPhone">
<el-input v-model="evaluationForm.customerPhone" placeholder="璇疯緭鍏ユ偍鐨勬墜鏈哄彿" />
<div v-if="evaluationForm.wechatOpenid" class="phone-tip">
- <i class="el-icon-info"></i>
- 寰俊鎺堟潈鏃犳硶鐩存帴鑾峰彇鎵嬫満鍙凤紝璇锋墜鍔ㄨ緭鍏�
+
</div>
</el-form-item>
</div>
@@ -65,17 +64,16 @@
<!-- 鏄熺骇璇勪环 - 鏍囬鍜岃瘎鍒嗗湪鍚屼竴琛� -->
<div v-if="dimension.dimensionType === 'star'" class="star-rating-inline">
<div class="dimension-title-inline">
- <span>{{ dimension.dimensionName }}</span>
+ <span class="dimension-name-fixed">{{ dimension.dimensionName }}</span>
<span v-if="dimension.isRequired === '1'" class="required">*</span>
</div>
<div class="star-rating-content">
<el-rate
:value="getDimensionScore(dimension.dimensionId)"
:max="5"
- show-text
- :texts="['寰堝樊', '杈冨樊', '涓�鑸�', '婊℃剰', '闈炲父婊℃剰']"
@change="updateDimensionScore(dimension.dimensionId, $event)"
size="small"
+ :aria-label="`璇勪环${dimension.dimensionName}`"
/>
</div>
</div>
@@ -90,8 +88,16 @@
{{ dimension.dimensionDesc }}
</div>
<div class="select-rating">
- <el-radio-group :value="getDimensionOption(dimension.dimensionId)" @change="updateDimensionOption(dimension.dimensionId, $event)" size="small">
- <el-radio v-for="option in getDimensionOptions(dimension)" :key="option.value" :label="option.value">
+ <el-radio-group
+ v-model="selectedOptions[dimension.dimensionId]"
+ @change="(value) => handleOptionChange(dimension.dimensionId, value)"
+ size="small"
+ :aria-label="`閫夋嫨${dimension.dimensionName}`">
+ <el-radio
+ v-for="option in getDimensionOptions(dimension)"
+ :key="option.value"
+ :label="option.value"
+ :aria-label="option.label">
{{ option.label }}
</el-radio>
</el-radio-group>
@@ -115,6 +121,7 @@
placeholder="璇疯緭鍏ユ偍鐨勬剰瑙佹垨寤鸿"
@input="updateDimensionText(dimension.dimensionId, $event)"
size="small"
+ :aria-label="`${dimension.dimensionName}璇勪环鎰忚`"
/>
</div>
</div>
@@ -166,6 +173,8 @@
wechatPhone: '',
evaluationDetails: []
},
+ // 鐢ㄤ簬瀛樺偍閫夋嫨绫诲瀷鐨勮瘎浠烽�夐」
+ selectedOptions: {},
rules: {
customerName: [
{ required: true, message: '璇疯緭鍏ユ偍鐨勫鍚�', trigger: 'blur' }
@@ -303,13 +312,37 @@
detail = { dimensionId, score: 0 };
this.evaluationForm.evaluationDetails.push(detail);
}
- detail.score = score;
+ // 浣跨敤Vue.set纭繚鍝嶅簲寮忔洿鏂�
+ this.$set(detail, 'score', score);
},
// 鑾峰彇缁村害閫夐」
getDimensionOption(dimensionId) {
const detail = this.evaluationForm.evaluationDetails.find(d => d.dimensionId === dimensionId);
return detail ? detail.optionValue : '';
+ },
+
+ // 鑾峰彇缁村害閫夐」鍊硷紙鐢ㄤ簬v-model锛�
+ getDimensionOptionValue(dimensionId) {
+ const detail = this.evaluationForm.evaluationDetails.find(d => d.dimensionId === dimensionId);
+ if (!detail) {
+ // 濡傛灉涓嶅瓨鍦紝鍒涘缓涓�涓柊鐨刣etail瀵硅薄
+ const newDetail = { dimensionId, optionValue: '' };
+ this.evaluationForm.evaluationDetails.push(newDetail);
+ return newDetail;
+ }
+ return detail;
+ },
+
+ // 鑾峰彇缁村害閫夐」鐨剉-model瀵硅薄
+ getDimensionOptionModel(dimensionId) {
+ const detail = this.evaluationForm.evaluationDetails.find(d => d.dimensionId === dimensionId);
+ if (!detail) {
+ const newDetail = { dimensionId, optionValue: '' };
+ this.evaluationForm.evaluationDetails.push(newDetail);
+ return newDetail;
+ }
+ return detail;
},
// 鏇存柊缁村害閫夐」
@@ -319,7 +352,16 @@
detail = { dimensionId, optionValue: '' };
this.evaluationForm.evaluationDetails.push(detail);
}
- detail.optionValue = optionValue;
+ // 浣跨敤Vue.set纭繚鍝嶅簲寮忔洿鏂�
+ this.$set(detail, 'optionValue', optionValue);
+ },
+
+ // 澶勭悊閫夐」鍙樺寲
+ handleOptionChange(dimensionId, value) {
+ // 鏇存柊selectedOptions
+ this.$set(this.selectedOptions, dimensionId, value);
+ // 鍚屾椂鏇存柊evaluationDetails
+ this.updateDimensionOption(dimensionId, value);
},
// 鑾峰彇缁村害鏂囨湰
@@ -335,7 +377,8 @@
detail = { dimensionId, textContent: '' };
this.evaluationForm.evaluationDetails.push(detail);
}
- detail.textContent = textContent;
+ // 浣跨敤Vue.set纭繚鍝嶅簲寮忔洿鏂�
+ this.$set(detail, 'textContent', textContent);
},
// 鑾峰彇缁村害閫夐」閰嶇疆
@@ -344,6 +387,7 @@
try {
return JSON.parse(dimension.options);
} catch (error) {
+ console.error('Error parsing options for', dimension.dimensionName, ':', error);
return [];
}
},
@@ -372,7 +416,7 @@
// 鎻愪氦璇勪环
const response = await submitEvaluation(this.evaluationForm);
if (response.code === 200) {
- this.resultMessage = response.msg;
+ this.resultMessage = "鎰熻阿鎮ㄧ殑鍙嶉锛屾偍鐨勫弽棣堝皢淇冧娇鎴戜滑涓嶆柇杩涙锛屾垜浠皢缁х画鎻愪緵鏇村ソ鐨勬湇鍔�";
this.showResult = true;
} else {
this.$message.error(response.msg || '鎻愪氦澶辫触锛岃閲嶈瘯');
@@ -391,6 +435,7 @@
this.evaluationForm.customerName = '';
this.evaluationForm.customerPhone = '';
this.evaluationForm.evaluationDetails = [];
+ this.selectedOptions = {};
this.$refs.evaluationForm.resetFields();
}
}
@@ -513,6 +558,15 @@
flex-shrink: 0;
}
+.dimension-name-fixed {
+ display: inline-block;
+ width: 100px;
+ text-align: left;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+
.star-rating-content {
flex: 1;
min-width: 200px;
@@ -540,6 +594,69 @@
.select-rating .el-radio__label {
font-size: 13px;
+}
+
+/* 鏀瑰杽鏃犻殰纰嶈闂� */
+.select-rating .el-radio__original {
+ position: absolute !important;
+ opacity: 0 !important;
+ width: 0 !important;
+ height: 0 !important;
+ margin: 0 !important;
+ padding: 0 !important;
+ border: none !important;
+ outline: none !important;
+ clip: rect(0, 0, 0, 0) !important;
+ -webkit-appearance: none !important;
+ -moz-appearance: none !important;
+ appearance: none !important;
+}
+
+.select-rating .el-radio__input {
+ position: relative;
+ white-space: nowrap;
+ vertical-align: middle;
+ outline: none;
+ line-height: 1;
+}
+
+.select-rating .el-radio__inner {
+ border: 1px solid #dcdfe6;
+ border-radius: 100%;
+ width: 14px;
+ height: 14px;
+ background-color: #fff;
+ position: relative;
+ cursor: pointer;
+ display: inline-block;
+ box-sizing: border-box;
+ transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46), background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);
+}
+
+.select-rating .el-radio__inner:hover {
+ border-color: #409eff;
+}
+
+.select-rating .el-radio.is-checked .el-radio__inner {
+ border-color: #409eff;
+ background: #409eff;
+}
+
+.select-rating .el-radio.is-checked .el-radio__inner::after {
+ transform: translate(-50%, -50%) scale(1);
+}
+
+.select-rating .el-radio__inner::after {
+ width: 4px;
+ height: 4px;
+ border-radius: 100%;
+ background-color: #fff;
+ content: "";
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%) scale(0);
+ transition: transform 0.15s ease-in;
}
/* 浼樺寲鏂囨湰璇勪环鏄剧ず */
@@ -736,6 +853,11 @@
font-size: 13px;
}
+ .dimension-name-fixed {
+ width: 120px;
+ font-size: 13px;
+ }
+
.star-rating-content {
min-width: auto;
width: 100%;
--
Gitblit v1.9.1