npm - @wg-npm/survey-response - Versions diffs - 1.78.511940 → 1.78.511944 - Mend

@wg-npm/survey-response 1.78.511940 → 1.78.511944

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/dist/survey-response.esm.js +121 -56
package/package.json +6 -6
package/src/components/more-survey-response.vue +8 -1
package/src/components/question/question-title.vue +137 -9
package/src/components/question/type/matrix.vue +49 -79
package/src/components/question/type/multi-selection.vue +30 -12
package/src/components/question/type/single-selection.vue +29 -7
package/src/components/survey-response.vue +9 -4
package/src/locale/lang/en-US.ts +1 -0
package/src/locale/lang/zh-CN.ts +1 -0

package/dist/survey-response.esm.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import Vue from 'vue';
 import _ from 'lodash';
-import { Row, Input as Input$1, Icon, FormItem, CheckboxGroup, Checkbox, Col, RadioGroup, Radio, InputNumber, Tooltip as Tooltip$1, Card, Slider, Form, Message } from 'view-design';
-import { CUSTOM_INPUT_REG, formatTitle, translate } from '@wg-npm/survey-core';
+import { Row, Input as Input$1, Icon, FormItem, InputNumber, CheckboxGroup, Checkbox, Col, RadioGroup, Radio, Tooltip as Tooltip$1, Card, Slider, Form, Message } from 'view-design';
+import { CUSTOM_INPUT_REG, BaseQuestionModel, formatTitle, translate } from '@wg-npm/survey-core';
 import deepmerge from 'deepmerge';
 var script = Vue.extend({
@@ -291,7 +291,7 @@ var QuestionMixin = Vue.extend({
 var script$2 = Vue.extend({
     name: "question-title",
-    components: { Icon, QuestionTitleDynamic: __vue_component__$1 },
+    components: { Icon, QuestionTitleDynamic: __vue_component__$1, FormItem, InputNumber },
     mixins: [OptionLayoutMixin, QuestionMixin],
     inject: ["$rootComponent"],
     props: {
@@ -310,6 +310,11 @@ var script$2 = Vue.extend({
             type: Object,
             required: false,
         },
+        answer: {
+            type: Object,
+            required: false,
+            default: null,
+        },
     },
     computed: {
         customFilledTitle() {
@@ -321,11 +326,63 @@ var script$2 = Vue.extend({
         isSingleSelection() {
             return this.question.type == "SINGLE_SELECTION";
         },
+        isTitleScoringEnabled() {
+            return (this.question.type === "MATRIX" &&
+                !!this.question.options?.titleScoringEnabled);
+        },
+        isTitleRequired() {
+            return !!this.question.options?.required;
+        },
+        answerTitleProp() {
+            return this.isMoreSurvey
+                ?
+                    `moreSurveyAnswers[${this.surveyIndex}].answers[${this.index}].titleScore`
+                : `answers[${this.index}].titleScore`;
+        },
+        questionTypeDesc() {
+            const type = this.question.type;
+            if (type === "TEXT_TITLE") {
+                return "";
+            }
+            const typeName = this.t(`survey_creator.question.types.${type}`, this.$rootComponent.currentLanguage);
+            if (type === "SINGLE_SELECTION" ||
+                type === "MULTI_SELECTION" ||
+                type === "MATRIX") {
+                const maxScore = BaseQuestionModel.getMaxScore(this.question);
+                const label = this.t("survey_creator.question.max_score", this.$rootComponent.currentLanguage);
+                return `${typeName}（${label}${maxScore}）`;
+            }
+            if (type === "SCORING") {
+                const range = BaseQuestionModel.getScoreRange(this.question);
+                const label = this.t("survey_creator.question.scoring.scoreRange", this.$rootComponent.currentLanguage);
+                return `${typeName}（${label}${range}）`;
+            }
+            return typeName;
+        },
     },
     methods: {
         getTitle(question) {
             return formatTitle(question, this.$rootComponent.currentLanguage);
         },
+        validateTitleScore(rule, value, callback) {
+            if (value === null || value === undefined) {
+                callback();
+                return;
+            }
+            const min = this.question.options.scoreMin;
+            const max = this.question.options.scoreMax;
+            if (min !== null && min !== undefined && value < min) {
+                const tip = this.t("survey_response.question.matrix_title_score_range_tip");
+                callback(new Error(tip.replace("{0}", min).replace("{1}", max)));
+                return;
+            }
+            if (max !== null && max !== undefined && value > max) {
+                const tip = this.t("survey_response.question.matrix_title_score_range_tip");
+                callback(new Error(tip.replace("{0}", min).replace("{1}", max)));
+                return;
+            }
+            callback();
+        },
     },
 });
@@ -333,13 +390,20 @@ var script$2 = Vue.extend({
 const __vue_script__$2 = script$2;
 /* template */
-var __vue_render__$1 = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"question-title"},[(_vm.question.type !== 'text_title')?_c('span',{staticClass:"pr-sm"},[(_vm.question.options.required)?_c('label',{staticClass:"require-label"},[_vm._v("*")]):_vm._e(),_vm._v(" "),(_vm.question.header.number)?_c('label',{staticClass:"number"},[_vm._v(_vm._s(_vm.question.header.number)+".")]):_vm._e()]):_vm._e(),_vm._v(" "),(_vm.question)?_c('question-title-dynamic',{attrs:{"splitedTitles":_vm.getTitle(_vm.question),"customFilledTitle":_vm.customFilledTitle}}):_vm._e(),_vm._v(" "),(_vm.haveStar)?_c('span',{staticClass:"options-explain",style:({ display: _vm.isMobile() ? 'block' : '' })},[(_vm.isSingleSelection)?_c('span',[_vm._v("\n      ("+_vm._s(_vm.t(
+var __vue_render__$1 = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"question-title"},[(_vm.question.type !== 'text_title')?_c('span',{staticClass:"pr-sm"},[(_vm.question.options.required)?_c('label',{staticClass:"require-label"},[_vm._v("*")]):_vm._e(),_vm._v(" "),(_vm.question.header.number)?_c('label',{staticClass:"number"},[_vm._v(_vm._s(_vm.question.header.number)+".")]):_vm._e()]):_vm._e(),_vm._v(" "),(_vm.question)?_c('question-title-dynamic',{attrs:{"customFilledTitle":_vm.customFilledTitle,"splitedTitles":_vm.getTitle(_vm.question)}}):_vm._e(),_vm._v(" "),(_vm.questionTypeDesc)?_c('span',{staticClass:"options-explain pl-sm"},[_vm._v("\n    "+_vm._s(_vm.questionTypeDesc)+"\n  ")]):_vm._e(),_vm._v(" "),(_vm.isTitleScoringEnabled && _vm.answer)?_c('FormItem',{staticClass:"title-score-form-item",attrs:{"prop":_vm.answerTitleProp,"rules":[
+      {
+        required: _vm.isTitleRequired && !_vm.question.options.disabled,
+        message: _vm.t('survey_response.question.question_required'),
+      },
+      { validator: _vm.validateTitleScore } ]}},[_c('InputNumber',{staticClass:"title-score-input",attrs:{"disabled":_vm.question.options.disabled,"max":_vm.question.options.scoreMax != null
+          ? _vm.question.options.scoreMax
+          : _vm.question.options.score || 100,"min":_vm.question.options.scoreMin != null ? _vm.question.options.scoreMin : 0,"placeholder":_vm.t('survey_response.question.matrix_title_score_placeholder')},model:{value:(_vm.answer.titleScore),callback:function ($$v) {_vm.$set(_vm.answer, "titleScore", $$v);},expression:"answer.titleScore"}})],1):_vm._e(),_vm._v(" "),(_vm.haveStar)?_c('span',{staticClass:"options-explain",style:({ display: _vm.isMobile() ? 'block' : '' })},[(_vm.isSingleSelection)?_c('span',[_vm._v("\n      ("+_vm._s(_vm.t(
           "survey_creator.question.star_single",
           _vm.$rootComponent.currentLanguage
-        ))+"\n      "),_c('span',[_c('Icon',{attrs:{"type":"md-star","color":"orange","size":16}})],1),_vm._v(")\n    ")]):_c('span',[_vm._v("\n      (\n      "+_vm._s(_vm.t(
+        ))+"\n      "),_c('span',[_c('Icon',{attrs:{"size":16,"color":"orange","type":"md-star"}})],1),_vm._v(")\n    ")]):_c('span',[_vm._v("\n      (\n      "+_vm._s(_vm.t(
           "survey_creator.question.star_single",
           _vm.$rootComponent.currentLanguage
-        ))+"\n      "),_c('Icon',{attrs:{"type":"md-star","color":"orange","size":16}}),_vm._v("\n      "+_vm._s(_vm.t(
+        ))+"\n      "),_c('Icon',{attrs:{"size":16,"color":"orange","type":"md-star"}}),_vm._v("\n      "+_vm._s(_vm.t(
           "survey_creator.question.star_multi_prefix",
           _vm.$rootComponent.currentLanguage
         ))+"\n      "+_vm._s(_vm.question.options.starMinCount)+"\n      "+_vm._s(_vm.t(
@@ -351,11 +415,11 @@ var __vue_staticRenderFns__$1 = [];
   /* style */
   const __vue_inject_styles__$2 = function (inject) {
     if (!inject) return
-    inject("data-v-bf231d5a_0", { source: ".flex[data-v-bf231d5a]{display:flex;align-items:center;white-space:nowrap}.pr-sm[data-v-bf231d5a]{padding-right:4px}", map: undefined, media: undefined });
+    inject("data-v-bf2c6078_0", { source: ".question-title[data-v-bf2c6078]{display:flex;align-items:center;flex-wrap:wrap}.pr-sm[data-v-bf2c6078]{padding-right:4px}.pl-sm[data-v-bf2c6078]{padding-left:4px}.title-score-form-item[data-v-bf2c6078]{margin-bottom:0}.title-score-form-item .title-score-input[data-v-bf2c6078]{margin-left:12px;width:120px}", map: undefined, media: undefined });
   };
   /* scoped */
-  const __vue_scope_id__$2 = "data-v-bf231d5a";
+  const __vue_scope_id__$2 = "data-v-bf2c6078";
   /* module identifier */
   const __vue_module_identifier__$2 = undefined;
   /* functional template */
@@ -484,12 +548,19 @@ var __vue_render__$2 = function () {var _vm=this;var _h=_vm.$createElement;var _
     type: 'array',
     min: 1,
     message: _vm.t('survey_response.question.question_required'),
-  }}},[_c('CheckboxGroup',{on:{"on-change":_vm.selChange},model:{value:(_vm.value.answer),callback:function ($$v) {_vm.$set(_vm.value, "answer", $$v);},expression:"value.answer"}},[_c('Row',{style:({ display: _vm.isMobile() ? 'inline-block' : 'flex' }),attrs:{"type":_vm.flexOrBlock,"justify":"start","gutter":60}},_vm._l((_vm.question.choices),function(choice){return _c('Col',{key:choice.id,class:_vm.optionLayout,style:({ display: _vm.isMobile() ? 'inline-block' : 'flex' })},[_c('Checkbox',{key:choice.id,style:({
+  }}},[_c('CheckboxGroup',{on:{"on-change":_vm.selChange},model:{value:(_vm.value.answer),callback:function ($$v) {_vm.$set(_vm.value, "answer", $$v);},expression:"value.answer"}},[_c('Row',{style:({ display: _vm.isMobile() ? 'inline-block' : 'flex' }),attrs:{"gutter":60,"type":_vm.flexOrBlock,"justify":"start"}},_vm._l((_vm.question.choices),function(choice){return _c('Col',{key:choice.id,class:_vm.optionLayout,style:({ display: _vm.isMobile() ? 'inline-block' : 'flex' })},[_c('Checkbox',{key:choice.id,style:({
             display: _vm.isMobile() ? 'inline-block' : 'flex',
             'align-items': _vm.isMobile() ? '' : 'center',
-          }),attrs:{"label":choice.id,"disabled":_vm.question.options.readonly ||
+          }),attrs:{"disabled":_vm.question.options.readonly ||
             choice.readonly ||
-            _vm.question.options.disabled}},[_c('span',[_vm._v(_vm._s(_vm.i18nText(choice.text)))])]),_vm._v(" "),_vm._l((_vm.value.inputAnswers),function(inputAnswer,inputIndex){return _c('div',{key:inputIndex},[(
+            _vm.question.options.disabled,"label":choice.id}},[_c('span',[_vm._v(_vm._s(_vm.i18nText(choice.text)))]),_vm._v(" "),(
+              _vm.options &&
+              _vm.options.showChoiceScore &&
+              _vm.question.options.scoringEnabled
+            )?_c('span',{staticClass:"options-explain"},[_vm._v("\n            ("+_vm._s((choice.options && choice.options.score) || 0)+"\n            "+_vm._s(_vm.t(
+                "survey_creator.question.scores",
+                _vm.$rootComponent.currentLanguage
+              ))+")\n          ")]):_vm._e()]),_vm._v(" "),_vm._l((_vm.value.inputAnswers),function(inputAnswer,inputIndex){return _c('div',{key:inputIndex},[(
               choice.id === inputAnswer.choiceId &&
               _vm.value.answer.includes(choice.id)
             )?_c('FormItem',{attrs:{"prop":_vm.inputAnswerProp(inputIndex),"rules":[
@@ -510,11 +581,11 @@ var __vue_staticRenderFns__$2 = [];
   /* style */
   const __vue_inject_styles__$3 = function (inject) {
     if (!inject) return
-    inject("data-v-aff37854_0", { source: ".choice-title[data-v-aff37854]{margin-left:8px;margin-right:8px}.choice-score[data-v-aff37854]{margin-right:8px}.ivu-checkbox-wrapper[data-v-aff37854]{white-space:nowrap}", map: undefined, media: undefined });
+    inject("data-v-4754c81a_0", { source: ".choice-title[data-v-4754c81a]{margin-left:8px;margin-right:8px}.options-explain[data-v-4754c81a]{margin-left:4px;color:#9ea7b4;font-size:12px}.ivu-checkbox-wrapper[data-v-4754c81a]{white-space:nowrap}", map: undefined, media: undefined });
   };
   /* scoped */
-  const __vue_scope_id__$3 = "data-v-aff37854";
+  const __vue_scope_id__$3 = "data-v-4754c81a";
   /* module identifier */
   const __vue_module_identifier__$3 = undefined;
   /* functional template */
@@ -16361,6 +16432,7 @@ var defaultLang = {
             input_text_limit: "输入项字数不少于{0}字",
             choice_required: "此项必填",
             matrix_title_score: "分数",
+            matrix_title_score_placeholder: "请输入评分",
             matrix_title_score_range_tip: "请输入{0}到{1}之间的分值",
         },
     },
@@ -17082,10 +17154,17 @@ var __vue_render__$5 = function () {var _vm=this;var _h=_vm.$createElement;var _
     required: _vm.question.options.required && !_vm.question.options.disabled,
     message: _vm.t('survey_response.question.question_required'),
     validator: _vm.customRequiredValidator,
-  }}},[_c('RadioGroup',{staticClass:"question-choice",on:{"on-change":_vm.selChange},model:{value:(_vm.value.answer),callback:function ($$v) {_vm.$set(_vm.value, "answer", $$v);},expression:"value.answer"}},[_c('Row',{style:({ display: _vm.isMobile() ? 'inline-block' : 'flex' }),attrs:{"type":_vm.flexOrBlock,"justify":"start","gutter":60}},_vm._l((_vm.question.choices),function(choice){return _c('Col',{key:choice.id,class:_vm.optionLayout,style:({ display: _vm.isMobile() ? 'inline-block' : 'flex' })},[_c('Radio',{key:choice.id,style:({
+  }}},[_c('RadioGroup',{staticClass:"question-choice",on:{"on-change":_vm.selChange},model:{value:(_vm.value.answer),callback:function ($$v) {_vm.$set(_vm.value, "answer", $$v);},expression:"value.answer"}},[_c('Row',{style:({ display: _vm.isMobile() ? 'inline-block' : 'flex' }),attrs:{"gutter":60,"type":_vm.flexOrBlock,"justify":"start"}},_vm._l((_vm.question.choices),function(choice){return _c('Col',{key:choice.id,class:_vm.optionLayout,style:({ display: _vm.isMobile() ? 'inline-block' : 'flex' })},[_c('Radio',{key:choice.id,style:({
             display: _vm.isMobile() ? 'inline-block' : 'flex',
             'align-items': _vm.isMobile() ? '' : 'center',
-          }),attrs:{"disabled":_vm.question.options.readonly || _vm.question.options.disabled,"label":choice.id},nativeOn:{"click":function($event){return _vm.toggleAnswer($event, choice.id, _vm.question.options.disabled)}}},[(_vm.haveStar(choice))?_c('span',[_c('Icon',{attrs:{"type":"md-star","color":"orange","size":16}})],1):_vm._e(),_vm._v(" "),_c('span',[_vm._v(_vm._s(_vm.i18nText(choice.text)))])]),_vm._v(" "),_vm._l((_vm.value.inputAnswers),function(inputAnswer,inputIndex){return _c('div',{key:inputIndex},[(
+          }),attrs:{"disabled":_vm.question.options.readonly || _vm.question.options.disabled,"label":choice.id},nativeOn:{"click":function($event){return _vm.toggleAnswer($event, choice.id, _vm.question.options.disabled)}}},[(_vm.haveStar(choice))?_c('span',[_c('Icon',{attrs:{"size":16,"color":"orange","type":"md-star"}})],1):_vm._e(),_vm._v(" "),_c('span',[_vm._v(_vm._s(_vm.i18nText(choice.text)))]),_vm._v(" "),(
+              _vm.options &&
+              _vm.options.showChoiceScore &&
+              _vm.question.options.scoringEnabled
+            )?_c('span',{staticClass:"options-explain"},[_vm._v("\n            ("+_vm._s((choice.options && choice.options.score) || 0)+"\n            "+_vm._s(_vm.t(
+                "survey_creator.question.scores",
+                _vm.$rootComponent.currentLanguage
+              ))+")\n          ")]):_vm._e()]),_vm._v(" "),_vm._l((_vm.value.inputAnswers),function(inputAnswer,inputIndex){return _c('div',{key:inputIndex},[(
               choice.id === inputAnswer.choiceId && choice.id === _vm.value.answer
             )?_c('FormItem',{attrs:{"prop":_vm.inputAnswerProp(inputIndex),"rules":[
               {
@@ -17105,11 +17184,11 @@ var __vue_staticRenderFns__$5 = [];
   /* style */
   const __vue_inject_styles__$6 = function (inject) {
     if (!inject) return
-    inject("data-v-dbceb2be_0", { source: ".choice-title[data-v-dbceb2be]{margin-left:8px;margin-right:8px}", map: undefined, media: undefined });
+    inject("data-v-7562e82a_0", { source: ".choice-title[data-v-7562e82a]{margin-left:8px;margin-right:8px}.options-explain[data-v-7562e82a]{margin-left:4px;color:#9ea7b4;font-size:12px}", map: undefined, media: undefined });
   };
   /* scoped */
-  const __vue_scope_id__$6 = "data-v-dbceb2be";
+  const __vue_scope_id__$6 = "data-v-7562e82a";
   /* module identifier */
   const __vue_module_identifier__$6 = undefined;
   /* functional template */
@@ -17143,7 +17222,6 @@ var script$7 = Vue.extend({
         Radio,
         Row,
         Col,
-        InputNumber,
     },
     props: {
         question: {
@@ -17173,24 +17251,22 @@ var script$7 = Vue.extend({
             this.value = n;
             this.initData();
         },
+        "value.titleScore"() {
+            this.selChange();
+        },
     },
     computed: {
         isTitleScoringEnabled() {
             return !!_.get(this.question, "options.titleScoringEnabled", false);
         },
-        isTitleRequired() {
-            return !!_.get(this.question, "options.required", false);
-        },
         isSubRequired() {
             const opts = this.question.options;
             return opts.subRequired !== undefined
                 ? !!opts.subRequired
                 : !!opts.required;
         },
-        answerTitleProp() {
-            return this.isMoreSurvey
-                ? `moreSurveyAnswers[${this.surveyIndex}].answers[${this.index}].titleScore`
-                : `answers[${this.index}].titleScore`;
+        choiceMaxScore() {
+            return (_.max(this.question.choices.map((choice) => parseFloat(choice?.options?.score || 0))) || 0);
         },
     },
     methods: {
@@ -17221,25 +17297,6 @@ var script$7 = Vue.extend({
                 this.value.answer.push(_answer);
             });
         },
-        validateTitleScore(rule, value, callback) {
-            if (value === null || value === undefined) {
-                callback();
-                return;
-            }
-            const min = this.question.options.scoreMin;
-            const max = this.question.options.scoreMax;
-            if (min !== null && min !== undefined && value < min) {
-                const tip = this.t("survey_response.question.matrix_title_score_range_tip");
-                callback(new Error(tip.replace("{0}", min).replace("{1}", max)));
-                return;
-            }
-            if (max !== null && max !== undefined && value > max) {
-                const tip = this.t("survey_response.question.matrix_title_score_range_tip");
-                callback(new Error(tip.replace("{0}", min).replace("{1}", max)));
-                return;
-            }
-            callback();
-        },
         selChange() {
             let score = 0;
             if (this.isTitleScoringEnabled && this.value.titleScore != null) {
@@ -17271,29 +17328,34 @@ var script$7 = Vue.extend({
 const __vue_script__$7 = script$7;
 /* template */
-var __vue_render__$6 = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[(_vm.isTitleScoringEnabled)?_c('div',{staticClass:"title-score-section"},[_c('FormItem',{attrs:{"prop":_vm.answerTitleProp,"rules":[
-        {
-          required: _vm.isTitleRequired && !_vm.question.options.disabled,
-          message: _vm.t('survey_response.question.question_required'),
-        },
-        { validator: _vm.validateTitleScore } ]}},[_c('div',{staticClass:"title-score-input-row"},[_c('span',{staticClass:"title-score-label"},[_vm._v(_vm._s(_vm.t('survey_response.question.matrix_title_score'))+"：")]),_vm._v(" "),_c('InputNumber',{attrs:{"min":_vm.question.options.scoreMin != null ? _vm.question.options.scoreMin : 0,"max":_vm.question.options.scoreMax != null ? _vm.question.options.scoreMax : (_vm.question.options.score || 100),"disabled":_vm.question.options.disabled},on:{"on-change":_vm.selChange},model:{value:(_vm.value.titleScore),callback:function ($$v) {_vm.$set(_vm.value, "titleScore", $$v);},expression:"value.titleScore"}})],1)])],1):_vm._e(),_vm._v(" "),_vm._l((_vm.question.subQuestions),function(subQuestion,subIndex){return _c('div',{key:subIndex,staticClass:"sub-question"},[(_vm.isSubRequired)?_c('label',{staticClass:"require-label"},[_vm._v("*")]):_vm._e(),_vm._v(" "),_c('span',{staticClass:"number"},[_vm._v("\n      "+_vm._s(_vm.question.header.number)+"-"+_vm._s(subQuestion.number)+".")]),_vm._v(" "),_c('span',{staticClass:"title"},[_vm._v(" "+_vm._s(_vm.i18nText(subQuestion.text))+" ")]),_vm._v(" "),_c('FormItem',{attrs:{"prop":_vm.answerProp(subIndex),"rules":{
+var __vue_render__$6 = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',_vm._l((_vm.question.subQuestions),function(subQuestion,subIndex){return _c('div',{key:subIndex,staticClass:"sub-question"},[(_vm.isSubRequired)?_c('label',{staticClass:"require-label"},[_vm._v("*")]):_vm._e(),_vm._v(" "),_c('span',{staticClass:"number"},[_vm._v("\n      "+_vm._s(_vm.question.header.number)+"-"+_vm._s(subQuestion.number)+".")]),_vm._v(" "),_c('span',{staticClass:"title"},[_vm._v(" "+_vm._s(_vm.i18nText(subQuestion.text))+" ")]),_vm._v(" "),(_vm.question.options.scoringEnabled && _vm.choiceMaxScore)?_c('span',{staticClass:"options-explain"},[_vm._v("\n      ("+_vm._s(_vm.t(
+          "survey_creator.question.max_score",
+          _vm.$rootComponent.currentLanguage
+        ))+_vm._s(_vm.choiceMaxScore)+")\n    ")]):_vm._e(),_vm._v(" "),_c('FormItem',{attrs:{"prop":_vm.answerProp(subIndex),"rules":{
         required: _vm.isSubRequired && !_vm.question.options.disabled,
         message: _vm.t('survey_response.question.question_required'),
-      }}},[_c('RadioGroup',{on:{"on-change":_vm.selChange},model:{value:(_vm.value.answer[subIndex].answer),callback:function ($$v) {_vm.$set(_vm.value.answer[subIndex], "answer", $$v);},expression:"value.answer[subIndex].answer"}},[_c('Row',{attrs:{"type":"flex","justify":"start","gutter":60}},_vm._l((_vm.question.choices),function(choice){return _c('Col',{key:choice.id,class:_vm.optionLayout},[_c('Radio',{key:choice.id,attrs:{"label":choice.id,"disabled":subQuestion.options.readonly || _vm.question.options.disabled},nativeOn:{"click":function($event){return _vm.toggleAnswer(
+      }}},[_c('RadioGroup',{on:{"on-change":_vm.selChange},model:{value:(_vm.value.answer[subIndex].answer),callback:function ($$v) {_vm.$set(_vm.value.answer[subIndex], "answer", $$v);},expression:"value.answer[subIndex].answer"}},[_c('Row',{attrs:{"gutter":60,"justify":"start","type":"flex"}},_vm._l((_vm.question.choices),function(choice){return _c('Col',{key:choice.id,class:_vm.optionLayout},[_c('Radio',{key:choice.id,attrs:{"disabled":subQuestion.options.readonly || _vm.question.options.disabled,"label":choice.id},nativeOn:{"click":function($event){return _vm.toggleAnswer(
                   choice.id,
                   subIndex,
                   subQuestion.options.readonly || _vm.question.options.disabled
-                )}}},[_c('span',[_vm._v(_vm._s(_vm.i18nText(choice.text)))])])],1)}),1)],1)],1)],1)})],2)};
+                )}}},[_c('span',[_vm._v(_vm._s(_vm.i18nText(choice.text)))]),_vm._v(" "),(
+                  _vm.options &&
+                  _vm.options.showChoiceScore &&
+                  _vm.question.options.scoringEnabled
+                )?_c('span',{staticClass:"options-explain"},[_vm._v("\n                ("+_vm._s((choice.options && choice.options.score) || 0)+"\n                "+_vm._s(_vm.t(
+                    "survey_creator.question.scores",
+                    _vm.$rootComponent.currentLanguage
+                  ))+")\n              ")]):_vm._e()])],1)}),1)],1)],1)],1)}),0)};
 var __vue_staticRenderFns__$6 = [];
   /* style */
   const __vue_inject_styles__$7 = function (inject) {
     if (!inject) return
-    inject("data-v-02dfeb56_0", { source: ".require-label[data-v-02dfeb56]{color:#ed4014}.title-score-section[data-v-02dfeb56]{margin-bottom:12px}.title-score-section .title-score-input-row[data-v-02dfeb56]{display:flex;align-items:center;gap:8px}.title-score-section .title-score-input-row .title-score-label[data-v-02dfeb56]{font-size:14px;color:#515a6e;white-space:nowrap}", map: undefined, media: undefined });
+    inject("data-v-6fac9370_0", { source: ".require-label[data-v-6fac9370]{color:#ed4014}.options-explain[data-v-6fac9370]{margin-left:4px;color:#9ea7b4;font-size:12px}", map: undefined, media: undefined });
   };
   /* scoped */
-  const __vue_scope_id__$7 = "data-v-02dfeb56";
+  const __vue_scope_id__$7 = "data-v-6fac9370";
   /* module identifier */
   const __vue_module_identifier__$7 = undefined;
   /* functional template */
@@ -18451,6 +18513,7 @@ var script$i = Vue.extend({
         },
         options: {
             type: Object,
+            default: () => { },
         },
         size: {
             type: String,
@@ -18556,7 +18619,7 @@ var script$i = Vue.extend({
 const __vue_script__$i = script$i;
 /* template */
-var __vue_render__$h = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (!_vm.emptyQuestions)?_c('div',{staticClass:"survey-response-wrapper"},[_c('Form',{ref:"responseForm",attrs:{"model":_vm.response,"disabled":_vm.readonly}},_vm._l((_vm.sortQuestions),function(question,index){return _c('div',{key:index,staticClass:"question"},[_c('question-title',{attrs:{"question":question,"index":index}}),_vm._v(" "),_c('question-body',{attrs:{"question":_vm.calculateQuestion(question, question.originalIndex),"answer":_vm.response.answers[question.originalIndex],"index":question.originalIndex,"options":_vm.options,"readonly":_vm.readonly},on:{"singleQuestion":_vm.handleSelected}})],1)}),0)],1):_c('empty-question')};
+var __vue_render__$h = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (!_vm.emptyQuestions)?_c('div',{staticClass:"survey-response-wrapper"},[_c('Form',{ref:"responseForm",attrs:{"disabled":_vm.readonly,"model":_vm.response}},_vm._l((_vm.sortQuestions),function(question,index){return _c('div',{key:index,staticClass:"question"},[_c('question-title',{attrs:{"answer":_vm.response.answers[question.originalIndex],"index":question.originalIndex,"question":question}}),_vm._v(" "),_c('question-body',{attrs:{"answer":_vm.response.answers[question.originalIndex],"index":question.originalIndex,"options":_vm.options,"question":_vm.calculateQuestion(question, question.originalIndex),"readonly":_vm.readonly},on:{"singleQuestion":_vm.handleSelected}})],1)}),0)],1):_c('empty-question')};
 var __vue_staticRenderFns__$h = [];
   /* style */
@@ -18743,7 +18806,9 @@ var script$j = Vue.extend({
 const __vue_script__$j = script$j;
 /* template */
-var __vue_render__$i = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (!_vm.emptyQuestions)?_c('div',{staticClass:"survey-response-wrapper"},[_c('Form',{ref:"responseForm",attrs:{"model":_vm.responseSurveyAnswers,"disabled":_vm.readonly}},_vm._l((_vm.surveys),function(survey,surveyIndex){return _c('div',{key:surveyIndex},_vm._l((_vm.getFilterSortQuestions(survey.id)),function(question,index){return _c('div',{key:index,staticClass:"question"},[_c('question-title',{attrs:{"question":question,"custom-question":_vm.getCustomQuestion(question.id),"index":index}}),_vm._v(" "),_c('question-body',{attrs:{"question":_vm.calculateQuestion(question, question.originalIndex),"answer":_vm.responseSurveyAnswers.moreSurveyAnswers[surveyIndex].answers[
+var __vue_render__$i = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (!_vm.emptyQuestions)?_c('div',{staticClass:"survey-response-wrapper"},[_c('Form',{ref:"responseForm",attrs:{"model":_vm.responseSurveyAnswers,"disabled":_vm.readonly}},_vm._l((_vm.surveys),function(survey,surveyIndex){return _c('div',{key:surveyIndex},_vm._l((_vm.getFilterSortQuestions(survey.id)),function(question,index){return _c('div',{key:index,staticClass:"question"},[_c('question-title',{attrs:{"question":question,"custom-question":_vm.getCustomQuestion(question.id),"index":question.originalIndex,"survey-index":surveyIndex,"is-more-survey":true,"answer":_vm.responseSurveyAnswers.moreSurveyAnswers[surveyIndex].answers[
+              question.originalIndex
+            ]}}),_vm._v(" "),_c('question-body',{attrs:{"question":_vm.calculateQuestion(question, question.originalIndex),"answer":_vm.responseSurveyAnswers.moreSurveyAnswers[surveyIndex].answers[
               question.originalIndex
             ],"index":question.originalIndex,"survey":survey,"survey-index":surveyIndex,"is-more-survey":true,"options":_vm.options,"readonly":_vm.readonly},on:{"singleQuestion":_vm.handleSelected}})],1)}),0)}),0)],1):_c('empty-question')};
 var __vue_staticRenderFns__$i = [];

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@wg-npm/survey-response",
-  "version": "1.78.511940",
+  "version": "1.78.511944",
   "description": "",
   "license": "MIT",
   "scripts": {
@@ -12,8 +12,8 @@
     "lint-fix": "eslint \"**/*.ts\"  \"**/*.vue\" --fix --no-error-on-unmatched-pattern"
   },
   "peerDependencies": {
-    "@wg-npm/survey-core": "1.78.511940",
-    "@wg-npm/survey-service-api": "1.78.511940",
+    "@wg-npm/survey-core": "1.78.511944",
+    "@wg-npm/survey-service-api": "1.78.511944",
     "axios": "^0.19.2",
     "deepmerge": "^4.2.2",
     "lodash": "^4.17.15",
@@ -34,8 +34,8 @@
     "@typescript-eslint/parser": "^3.6.0",
     "@vue/eslint-config-prettier": "^6.0.0",
     "@vue/eslint-config-typescript": "^5.0.2",
-    "@wg-npm/survey-core": "1.78.511940",
-    "@wg-npm/survey-service-api": "1.78.511940",
+    "@wg-npm/survey-core": "1.78.511944",
+    "@wg-npm/survey-service-api": "1.78.511944",
     "acorn": "^7.3.1",
     "axios": "^0.19.2",
     "babelrc-rollup": "^3.0.0",
@@ -72,7 +72,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "3a04b43e5f25768662fe9b63fa38b6e76e24bc4a",
+  "gitHead": "cff0ee830e5b7a7789ccc6cc43c51d190c096169",
   "rollup": {
     "external": [
       "vue",

package/src/components/more-survey-response.vue CHANGED Viewed

@@ -14,7 +14,14 @@
           <question-title
             :question="question"
             :custom-question="getCustomQuestion(question.id)"
-            :index="index"
+            :index="question.originalIndex"
+            :survey-index="surveyIndex"
+            :is-more-survey="true"
+            :answer="
+              responseSurveyAnswers.moreSurveyAnswers[surveyIndex].answers[
+                question.originalIndex
+              ]
+            "
           >
           </question-title>
           <question-body

package/src/components/question/question-title.vue CHANGED Viewed

@@ -8,13 +8,43 @@
     </span>
     <question-title-dynamic
       v-if="question"
-      :splitedTitles="getTitle(question)"
       :customFilledTitle="customFilledTitle"
+      :splitedTitles="getTitle(question)"
     ></question-title-dynamic>
+    <span v-if="questionTypeDesc" class="options-explain pl-sm">
+      {{ questionTypeDesc }}
+    </span>
+    <FormItem
+      v-if="isTitleScoringEnabled && answer"
+      :prop="answerTitleProp"
+      :rules="[
+        {
+          required: isTitleRequired && !question.options.disabled,
+          message: t('survey_response.question.question_required'),
+        },
+        { validator: validateTitleScore },
+      ]"
+      class="title-score-form-item"
+    >
+      <InputNumber
+        v-model="answer.titleScore"
+        :disabled="question.options.disabled"
+        :max="
+          question.options.scoreMax != null
+            ? question.options.scoreMax
+            : question.options.score || 100
+        "
+        :min="question.options.scoreMin != null ? question.options.scoreMin : 0"
+        :placeholder="
+          t('survey_response.question.matrix_title_score_placeholder')
+        "
+        class="title-score-input"
+      />
+    </FormItem>
     <span
-      class="options-explain"
       v-if="haveStar"
       :style="{ display: isMobile() ? 'block' : '' }"
+      class="options-explain"
     >
       <span v-if="isSingleSelection">
         ({{
@@ -23,7 +53,7 @@
             $rootComponent.currentLanguage
           )
         }}
-        <span> <Icon type="md-star" color="orange" :size="16" /> </span>)
+        <span> <Icon :size="16" color="orange" type="md-star" /> </span>)
       </span>
       <span v-else>
         (
@@ -33,7 +63,7 @@
             $rootComponent.currentLanguage
           )
         }}
-        <Icon type="md-star" color="orange" :size="16" />
+        <Icon :size="16" color="orange" type="md-star" />
         {{
           t(
             `survey_creator.question.star_multi_prefix`,
@@ -54,15 +84,19 @@
 </template>
 <script lang="ts">
 import Vue from "vue";
-import { Icon } from "view-design";
-import { formatTitle, QuestionType } from "@wg-npm/survey-core";
+import { FormItem, Icon, InputNumber } from "view-design";
+import {
+  BaseQuestionModel,
+  formatTitle,
+  QuestionType,
+} from "@wg-npm/survey-core";
 import OptionLayoutMixin from "../../mixins/option-layout-mixin";
 import QuestionTitleDynamic from "./question-title-dynamic.vue";
 import QuestionMixin from "../../mixins/question-mixin";
 export default Vue.extend({
   name: "question-title",
-  components: { Icon, QuestionTitleDynamic },
+  components: { Icon, QuestionTitleDynamic, FormItem, InputNumber },
   mixins: [OptionLayoutMixin, QuestionMixin],
   inject: ["$rootComponent"],
   props: {
@@ -81,6 +115,11 @@ export default Vue.extend({
       type: Object,
       required: false,
     },
+    answer: {
+      type: Object,
+      required: false,
+      default: null,
+    },
   },
   computed: {
     customFilledTitle() {
@@ -92,22 +131,111 @@ export default Vue.extend({
     isSingleSelection() {
       return this.question.type == QuestionType.SINGLE_SELECTION;
     },
+    isTitleScoringEnabled() {
+      return (
+        this.question.type === QuestionType.MATRIX &&
+        !!this.question.options?.titleScoringEnabled
+      );
+    },
+    isTitleRequired() {
+      return !!this.question.options?.required;
+    },
+    answerTitleProp() {
+      // @ts-ignore
+      return this.isMoreSurvey
+        ? // @ts-ignore
+          `moreSurveyAnswers[${this.surveyIndex}].answers[${this.index}].titleScore`
+        : `answers[${this.index}].titleScore`;
+    },
+    questionTypeDesc() {
+      const type = this.question.type;
+      if (type === QuestionType.TEXT_TITLE) {
+        return "";
+      }
+      // @ts-ignore
+      const typeName = this.t(
+        `survey_creator.question.types.${type}`,
+        this.$rootComponent.currentLanguage
+      );
+      if (
+        type === QuestionType.SINGLE_SELECTION ||
+        type === QuestionType.MULTI_SELECTION ||
+        type === QuestionType.MATRIX
+      ) {
+        const maxScore = BaseQuestionModel.getMaxScore(this.question);
+        // @ts-ignore
+        const label = this.t(
+          "survey_creator.question.max_score",
+          this.$rootComponent.currentLanguage
+        );
+        return `${typeName}（${label}${maxScore}）`;
+      }
+      if (type === QuestionType.SCORING) {
+        const range = BaseQuestionModel.getScoreRange(this.question);
+        // @ts-ignore
+        const label = this.t(
+          "survey_creator.question.scoring.scoreRange",
+          this.$rootComponent.currentLanguage
+        );
+        return `${typeName}（${label}${range}）`;
+      }
+      return typeName;
+    },
   },
   methods: {
     getTitle(question) {
       return formatTitle(question, this.$rootComponent.currentLanguage);
     },
+    validateTitleScore(rule, value, callback) {
+      if (value === null || value === undefined) {
+        callback();
+        return;
+      }
+      const min = this.question.options.scoreMin;
+      const max = this.question.options.scoreMax;
+      if (min !== null && min !== undefined && value < min) {
+        // @ts-ignore
+        const tip = this.t(
+          "survey_response.question.matrix_title_score_range_tip"
+        );
+        callback(new Error(tip.replace("{0}", min).replace("{1}", max)));
+        return;
+      }
+      if (max !== null && max !== undefined && value > max) {
+        // @ts-ignore
+        const tip = this.t(
+          "survey_response.question.matrix_title_score_range_tip"
+        );
+        callback(new Error(tip.replace("{0}", min).replace("{1}", max)));
+        return;
+      }
+      callback();
+    },
   },
 });
 </script>
 <style lang="less" scoped>
-.flex {
+.question-title {
   display: flex;
   align-items: center;
-  white-space: nowrap;
+  flex-wrap: wrap;
 }
 .pr-sm {
   padding-right: 4px;
 }
+.pl-sm {
+  padding-left: 4px;
+}
+.title-score-form-item {
+  margin-bottom: 0;
+  .title-score-input {
+    margin-left: 12px;
+    width: 120px;
+  }
+}
 </style>

package/src/components/question/type/matrix.vue CHANGED Viewed

@@ -1,30 +1,5 @@
 <template>
   <div>
-    <!-- Main title score input (when titleScoringEnabled) -->
-    <div v-if="isTitleScoringEnabled" class="title-score-section">
-      <FormItem
-        :prop="answerTitleProp"
-        :rules="[
-          {
-            required: isTitleRequired && !question.options.disabled,
-            message: t('survey_response.question.question_required'),
-          },
-          { validator: validateTitleScore },
-        ]"
-      >
-        <div class="title-score-input-row">
-          <span class="title-score-label">{{ t('survey_response.question.matrix_title_score') }}：</span>
-          <InputNumber
-            v-model="value.titleScore"
-            :min="question.options.scoreMin != null ? question.options.scoreMin : 0"
-            :max="question.options.scoreMax != null ? question.options.scoreMax : (question.options.score || 100)"
-            :disabled="question.options.disabled"
-            @on-change="selChange"
-          />
-        </div>
-      </FormItem>
-    </div>
     <div
       v-for="(subQuestion, subIndex) in question.subQuestions"
       :key="subIndex"
@@ -35,6 +10,17 @@
         {{ question.header.number }}-{{ subQuestion.number }}.</span
       >
       <span class="title"> {{ i18nText(subQuestion.text) }} </span>
+      <span
+        v-if="question.options.scoringEnabled && choiceMaxScore"
+        class="options-explain"
+      >
+        ({{
+          t(
+            "survey_creator.question.max_score",
+            $rootComponent.currentLanguage
+          )
+        }}{{ choiceMaxScore }})
+      </span>
       <FormItem
         :prop="answerProp(subIndex)"
         :rules="{
@@ -46,15 +32,18 @@
           v-model="value.answer[subIndex].answer"
           @on-change="selChange"
         >
-          <Row type="flex" justify="start" :gutter="60">
+          <Row :gutter="60" justify="start" type="flex">
             <Col
               v-for="choice in question.choices"
               :key="choice.id"
               :class="optionLayout"
             >
               <Radio
-                :label="choice.id"
                 :key="choice.id"
+                :disabled="
+                  subQuestion.options.readonly || question.options.disabled
+                "
+                :label="choice.id"
                 @click.native="
                   toggleAnswer(
                     choice.id,
@@ -62,11 +51,24 @@
                     subQuestion.options.readonly || question.options.disabled
                   )
                 "
-                :disabled="
-                  subQuestion.options.readonly || question.options.disabled
-                "
               >
                 <span>{{ i18nText(choice.text) }}</span>
+                <span
+                  v-if="
+                    options &&
+                    options.showChoiceScore &&
+                    question.options.scoringEnabled
+                  "
+                  class="options-explain"
+                >
+                  ({{ (choice.options && choice.options.score) || 0 }}
+                  {{
+                    t(
+                      "survey_creator.question.scores",
+                      $rootComponent.currentLanguage
+                    )
+                  }})
+                </span>
               </Radio>
             </Col>
           </Row>
@@ -81,7 +83,7 @@ import Vue from "vue";
 import _ from "lodash";
 import OptionLayoutMixin from "../../../mixins/option-layout-mixin";
 import LocaleMixin from "../../../mixins/locale-mixin";
-import { FormItem, RadioGroup, Radio, Row, Col, InputNumber } from "view-design";
+import { Col, FormItem, Radio, RadioGroup, Row } from "view-design";
 export default Vue.extend({
   name: "matrix",
@@ -94,7 +96,6 @@ export default Vue.extend({
     Radio,
     Row,
     Col,
-    InputNumber,
   },
   props: {
     question: {
@@ -124,27 +125,29 @@ export default Vue.extend({
       this.value = n;
       this.initData();
     },
+    "value.titleScore"() {
+      this.selChange();
+    },
   },
   computed: {
     isTitleScoringEnabled() {
       // @ts-ignore
       return !!_.get(this.question, "options.titleScoringEnabled", false);
     },
-    isTitleRequired() {
-      // @ts-ignore
-      return !!_.get(this.question, "options.required", false);
-    },
     isSubRequired() {
       const opts = this.question.options;
-      // subRequired is the new field; fall back to required for backward compat
       return opts.subRequired !== undefined
         ? !!opts.subRequired
         : !!opts.required;
     },
-    answerTitleProp() {
-      return this.isMoreSurvey
-        ? `moreSurveyAnswers[${this.surveyIndex}].answers[${this.index}].titleScore`
-        : `answers[${this.index}].titleScore`;
+    choiceMaxScore() {
+      return (
+        _.max(
+          (this.question.choices as any[]).map((choice) =>
+            parseFloat(choice?.options?.score || 0)
+          )
+        ) || 0
+      );
     },
   },
   methods: {
@@ -154,7 +157,6 @@ export default Vue.extend({
         : `answers[${this.index}].answer[${subIndex}].answer`;
     },
     initData() {
-      // Init main title score field
       if (this.isTitleScoringEnabled && this.value.titleScore === undefined) {
         this.$set(this.value, "titleScore", null);
       }
@@ -183,33 +185,11 @@ export default Vue.extend({
         this.value.answer.push(_answer);
       });
     },
-    validateTitleScore(rule, value, callback) {
-      if (value === null || value === undefined) {
-        callback();
-        return;
-      }
-      const min = this.question.options.scoreMin;
-      const max = this.question.options.scoreMax;
-      if (min !== null && min !== undefined && value < min) {
-        const tip = this.t("survey_response.question.matrix_title_score_range_tip");
-        callback(new Error(tip.replace("{0}", min).replace("{1}", max)));
-        return;
-      }
-      if (max !== null && max !== undefined && value > max) {
-        const tip = this.t("survey_response.question.matrix_title_score_range_tip");
-        callback(new Error(tip.replace("{0}", min).replace("{1}", max)));
-        return;
-      }
-      callback();
-    },
     selChange() {
       let score = 0;
-      // Add main title score
       if (this.isTitleScoringEnabled && this.value.titleScore != null) {
         score += parseFloat(this.value.titleScore) || 0;
       }
-      // Add sub-question choice scores
       // @ts-ignore
       _.each(this.value.answer, (sub_answer, index) => {
         // @ts-ignore
@@ -237,24 +217,14 @@ export default Vue.extend({
 });
 </script>
-<style scoped lang="less">
+<style lang="less" scoped>
 .require-label {
   color: #ed4014;
 }
-.title-score-section {
-  margin-bottom: 12px;
-  .title-score-input-row {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    .title-score-label {
-      font-size: 14px;
-      color: #515a6e;
-      white-space: nowrap;
-    }
-  }
+.options-explain {
+  margin-left: 4px;
+  color: #9ea7b4;
+  font-size: 12px;
 }
 </style>

package/src/components/question/type/multi-selection.vue CHANGED Viewed

@@ -10,10 +10,10 @@
   >
     <CheckboxGroup v-model="value.answer" @on-change="selChange">
       <Row
-        :type="flexOrBlock"
-        justify="start"
         :gutter="60"
         :style="{ display: isMobile() ? 'inline-block' : 'flex' }"
+        :type="flexOrBlock"
+        justify="start"
       >
         <Col
           v-for="choice in question.choices"
@@ -22,19 +22,35 @@
           :style="{ display: isMobile() ? 'inline-block' : 'flex' }"
         >
           <Checkbox
-            :style="{
-              display: isMobile() ? 'inline-block' : 'flex',
-              'align-items': isMobile() ? '' : 'center',
-            }"
-            :label="choice.id"
             :key="choice.id"
             :disabled="
               question.options.readonly ||
               choice.readonly ||
               question.options.disabled
             "
+            :label="choice.id"
+            :style="{
+              display: isMobile() ? 'inline-block' : 'flex',
+              'align-items': isMobile() ? '' : 'center',
+            }"
           >
             <span>{{ i18nText(choice.text) }}</span>
+            <span
+              v-if="
+                options &&
+                options.showChoiceScore &&
+                question.options.scoringEnabled
+              "
+              class="options-explain"
+            >
+              ({{ (choice.options && choice.options.score) || 0 }}
+              {{
+                t(
+                  "survey_creator.question.scores",
+                  $rootComponent.currentLanguage
+                )
+              }})
+            </span>
           </Checkbox>
           <div
@@ -83,12 +99,12 @@ import _ from "lodash";
 import OptionLayoutMixin from "../../../mixins/option-layout-mixin";
 import QuestionMixin from "../../../mixins/question-mixin";
 import {
-  FormItem,
-  CheckboxGroup,
   Checkbox,
-  Row,
+  CheckboxGroup,
   Col,
+  FormItem,
   Input,
+  Row,
 } from "view-design";
 export default Vue.extend({
@@ -201,8 +217,10 @@ export default Vue.extend({
   margin-right: 8px;
 }
-.choice-score {
-  margin-right: 8px;
+.options-explain {
+  margin-left: 4px;
+  color: #9ea7b4;
+  font-size: 12px;
 }
 .ivu-checkbox-wrapper {

package/src/components/question/type/single-selection.vue CHANGED Viewed

@@ -9,14 +9,14 @@
   >
     <RadioGroup
       v-model="value.answer"
-      @on-change="selChange"
       class="question-choice"
+      @on-change="selChange"
     >
       <Row
-        :type="flexOrBlock"
-        justify="start"
         :gutter="60"
         :style="{ display: isMobile() ? 'inline-block' : 'flex' }"
+        :type="flexOrBlock"
+        justify="start"
       >
         <Col
           v-for="choice in question.choices"
@@ -25,21 +25,37 @@
           :style="{ display: isMobile() ? 'inline-block' : 'flex' }"
         >
           <Radio
+            :key="choice.id"
+            :disabled="question.options.readonly || question.options.disabled"
+            :label="choice.id"
             :style="{
               display: isMobile() ? 'inline-block' : 'flex',
               'align-items': isMobile() ? '' : 'center',
             }"
-            :disabled="question.options.readonly || question.options.disabled"
-            :label="choice.id"
-            :key="choice.id"
             @click.native="
               toggleAnswer($event, choice.id, question.options.disabled)
             "
           >
             <span v-if="haveStar(choice)">
-              <Icon type="md-star" color="orange" :size="16" />
+              <Icon :size="16" color="orange" type="md-star" />
             </span>
             <span>{{ i18nText(choice.text) }}</span>
+            <span
+              v-if="
+                options &&
+                options.showChoiceScore &&
+                question.options.scoringEnabled
+              "
+              class="options-explain"
+            >
+              ({{ (choice.options && choice.options.score) || 0 }}
+              {{
+                t(
+                  "survey_creator.question.scores",
+                  $rootComponent.currentLanguage
+                )
+              }})
+            </span>
           </Radio>
           <div
             v-for="(inputAnswer, inputIndex) in value.inputAnswers"
@@ -217,4 +233,10 @@ export default Vue.extend({
   margin-left: 8px;
   margin-right: 8px;
 }
+.options-explain {
+  margin-left: 4px;
+  color: #9ea7b4;
+  font-size: 12px;
+}
 </style>

package/src/components/survey-response.vue CHANGED Viewed

@@ -1,17 +1,21 @@
 <template>
   <div v-if="!emptyQuestions" class="survey-response-wrapper">
-    <Form ref="responseForm" :model="response" :disabled="readonly">
+    <Form ref="responseForm" :disabled="readonly" :model="response">
       <div
-        :key="index"
         v-for="(question, index) in sortQuestions"
+        :key="index"
         class="question"
       >
-        <question-title :question="question" :index="index"></question-title>
+        <question-title
+          :answer="response.answers[question.originalIndex]"
+          :index="question.originalIndex"
+          :question="question"
+        ></question-title>
         <question-body
-          :question="calculateQuestion(question, question.originalIndex)"
           :answer="response.answers[question.originalIndex]"
           :index="question.originalIndex"
           :options="options"
+          :question="calculateQuestion(question, question.originalIndex)"
           :readonly="readonly"
           @singleQuestion="handleSelected"
         >
@@ -62,6 +66,7 @@ export default Vue.extend({
     },
     options: {
       type: Object,
+      default: () => {},
     },
     size: {
       type: String,

package/src/locale/lang/en-US.ts CHANGED Viewed

@@ -29,6 +29,7 @@ export default {
         "The number of characters in the entry should not be less than{0}",
       choice_required: "This item is required",
       matrix_title_score: "Score",
+      matrix_title_score_placeholder: "Please enter score",
       matrix_title_score_range_tip: "Please enter a value between {0} and {1}",
     },
   },

package/src/locale/lang/zh-CN.ts CHANGED Viewed

@@ -27,6 +27,7 @@ export default {
       input_text_limit: "输入项字数不少于{0}字",
       choice_required: "此项必填",
       matrix_title_score: "分数",
+      matrix_title_score_placeholder: "请输入评分",
       matrix_title_score_range_tip: "请输入{0}到{1}之间的分值",
     },
   },