@wg-npm/survey-creator 0.3.47 → 0.3.377-8.develop

package/src/components/editor/forms/evaluation/expr/if.vue

@@ -1,181 +1,269 @@
 <template>
-    <Card dis-hover>
-        <Row type="flex" :gutter="6" slot="title">
-            <Col>
-                <div class="text">
-                    {{t('survey_creator.question.evaluation.condition.if') }}
-                </div>
-            </Col>
-            <Col>
-                <Button type="primary" icon="md-add" @click="onAdd">
-                    {{t('survey_creator.question.evaluation.condition.add_if_template') }}
-                </Button>
-            </Col>
-        </Row>
-        <a href="#" slot="extra" @click.prevent="onDelete" v-show="deletable">
-            {{t('survey_creator.common.delete') }}
-        </a>
+  <Card dis-hover>
+    <Row type="flex" :gutter="6" slot="title">
+      <Col>
+        <div class="text">
+          {{ t("survey_creator.question.evaluation.condition.if") }}
+        </div>
+      </Col>
+      <Col>
+        <Button type="primary" icon="md-add" @click="onAdd">
+          {{
+            t("survey_creator.question.evaluation.condition.add_if_template")
+          }}
+        </Button>
+      </Col>
+    </Row>
+    <a href="#" slot="extra" @click.prevent="onDelete" v-show="deletable">
+      {{ t("survey_creator.common.delete") }}
+    </a>
+    <Row type="flex" justify="start" align="middle">
+      <Col :span="22">
         <Row type="flex" justify="start" align="middle">
-            <Col :span="22">
-                <Row type="flex" justify="start" align="middle">
-                    <Col class="label">
-                        <Icon type="ios-arrow-forward" color="#2d8cf0"/>
-                        {{t('survey_creator.question.evaluation.condition.requirements') }}
-                    </Col>
-                    <Col :span="16">
-                        <Select v-model="exprConditionType">
-                            <Option v-for="type in exprConditionTypes" :value="type" :key="type">
-                                {{ t(`survey_creator.question.evaluation.condition.type.${type}`) }}
-                            </Option>
-                        </Select>
-                    </Col>
-                </Row>
-            </Col>
-            <Col :span="2">
-                <Button icon="md-add" class="action" @click="addCondition"></Button>
-            </Col>
-        </Row>
-        <Row type="flex" justify="space-between" align="middle"
-             v-for="(condition, index) in evaluationItems[position].conditions" :key="index" class="mt-base">
-            <Col :span="22">
-                <condition :key="index" :index="index" :type="condition.type" v-model="condition.payload" @expr="expr"
-                           :question="question" :evaluation-items="evaluationItems" :item-index="position"/>
-            </Col>
-            <Col :span="2">
-                <Button icon="md-remove" class="action" style="margin-bottom: 24px;"
-                        @click="removeCondition(index)"></Button>
-            </Col>
+          <Col class="label">
+            <Icon type="ios-arrow-forward" color="#2d8cf0" />
+            {{ t("survey_creator.question.evaluation.condition.requirements") }}
+          </Col>
+          <Col :span="16">
+            <Select v-model="exprConditionType">
+              <Option
+                v-for="type in exprConditionTypes"
+                :value="type"
+                :key="type"
+              >
+                {{
+                  t(`survey_creator.question.evaluation.condition.type.${type}`)
+                }}
+              </Option>
+            </Select>
+          </Col>
         </Row>
-        <Row type="flex" justify="end" align="middle" class="mt-base">
-            <Col>
-                <FormItem
-                        :prop="'evaluationItems[' + position + '].text.' + primaryLanguage"
-                        :rules="{required: true, message: t('survey_creator.question.evaluation.condition.evaluation_require_tip')}"
-                >{{t('survey_creator.question.evaluation.condition.evaluation_label') }}
-                    <Input class="input" v-model.trim="evaluationItems[position].text[primaryLanguage]"/>
-                </FormItem>
-            </Col>
-        </Row>
-    </Card>
+      </Col>
+      <Col :span="2">
+        <Button
+          icon="md-add"
+          :disabled="disableAddConditionBtn"
+          class="action"
+          @click="addCondition"
+        ></Button>
+      </Col>
+    </Row>
+    <Row
+      type="flex"
+      justify="space-between"
+      align="middle"
+      v-for="(condition, index) in evaluationItems[position].conditions"
+      :key="index"
+      class="mt-base"
+    >
+      <Col :span="22">
+        <condition
+          :key="index"
+          :index="index"
+          :type="condition.type"
+          v-model="condition.payload"
+          @expr="expr"
+          :question="question"
+          :evaluation-items="evaluationItems"
+          :item-index="position"
+        />
+      </Col>
+      <Col :span="2">
+        <Button
+          icon="md-remove"
+          class="action"
+          style="margin-bottom: 24px"
+          @click="removeCondition(index)"
+        ></Button>
+      </Col>
+    </Row>
+    <Row type="flex" justify="end" align="middle" class="mt-base">
+      <Col>
+        <FormItem
+          :prop="'evaluationItems[' + position + '].text.' + primaryLanguage"
+          :rules="{
+            required: true,
+            message: t(
+              'survey_creator.question.evaluation.condition.evaluation_require_tip'
+            ),
+          }"
+          >{{
+            t("survey_creator.question.evaluation.condition.evaluation_label")
+          }}
+          <Input
+            class="input"
+            v-model.trim="evaluationItems[position].text[primaryLanguage]"
+          />
+        </FormItem>
+      </Col>
+    </Row>
+  </Card>
 </template>
 <script lang="ts">
-    import Vue from "vue";
-    import QuestionFormMixin from "../../../../../mixins/question-form-mixin";
-    import {
-        ExprConditionType,
-        ExprEvaluationItemType
-    } from "@wg-npm/survey-core/src/models";
-    import {Card, Row, Col, Button, Select, Option, Icon, FormItem, Input} from "view-design";
-    import Condition from "./condition.vue"
-    import _ from "lodash";
+import Vue from "vue";
+import QuestionFormMixin from "../../../../../mixins/question-form-mixin";
+import {
+  ExprConditionType,
+  ExprEvaluationItemType,
+} from "@wg-npm/survey-core/src/models";
+import {
+  Card,
+  Row,
+  Col,
+  Button,
+  Select,
+  Option,
+  Icon,
+  FormItem,
+  Input,
+} from "view-design";
+import Condition from "./condition.vue";
+import _ from "lodash";
 
-    export default Vue.extend({
-        name: "if",
-        mixins: [QuestionFormMixin],
-        components: {
-            Card,
-            Row,
-            Col,
-            Select,
-            Option,
-            Button,
-            Icon,
-            Condition,
-            FormItem,
-            Input
-        },
-        props: {
-            value: {
-                type: Array,
-                required: true
-            },
-            position: {
-                type: Number,
-                required: true
-            }
+export default Vue.extend({
+  name: "if",
+  mixins: [QuestionFormMixin],
+  components: {
+    Card,
+    Row,
+    Col,
+    Select,
+    Option,
+    Button,
+    Icon,
+    Condition,
+    FormItem,
+    Input,
+  },
+  props: {
+    value: {
+      type: Array,
+      required: true,
+    },
+    position: {
+      type: Number,
+      required: true,
+    },
+  },
+  data() {
+    return {
+      evaluationItems: this.value,
+      exprConditionType: ExprConditionType.AUTO,
+      exprConditionTypes: [
+        ExprConditionType.AUTO,
+        ExprConditionType.ASSIGN,
+        ExprConditionType.SCORE,
+      ],
+    };
+  },
+  computed: {
+    deletable() {
+      return (
+        _.size(
+          _.filter(
+            this.evaluationItems,
+            (item) => item.type == ExprEvaluationItemType.IF
+          )
+        ) > 1
+      );
+    },
+    disableAddConditionBtn() {
+      let conditions = this.evaluationItems[this.position].conditions;
+      let scoreConditions = _.size(
+        _.filter(conditions, (item) => item.type == ExprConditionType.SCORE)
+      );
+      return (
+        this.exprConditionType == ExprConditionType.SCORE && scoreConditions > 0
+      );
+    },
+  },
+  methods: {
+    onAdd() {
+      this.evaluationItems.splice(this.position + 1, 0, {
+        id: `Evaluation-Item-${_.now()}-${_.random(0, 9999999)}`,
+        type: ExprEvaluationItemType.IF,
+        text: {
+          "zh-CN": "",
         },
-        data() {
-            return {
-                evaluationItems: this.value,
-                exprConditionType: ExprConditionType.AUTO,
-                exprConditionTypes: [ExprConditionType.AUTO, ExprConditionType.ASSIGN]
-            };
+        conditions: [],
+      });
+    },
+    onDelete() {
+      this.evaluationItems.splice(this.position, 1);
+    },
+    addCondition() {
+      this.evaluationItems[this.position].conditions ||
+        this.$set(this.evaluationItems[this.position], "conditions", []);
+      this.evaluationItems[this.position].conditions.push({
+        type: this.exprConditionType,
+        payload: this.buildPayloadByType(this.exprConditionType),
+      });
+    },
+    buildPayloadByType(type) {
+      if (type == ExprConditionType.SCORE) {
+        return {
+          payload: {
+            minScore: 0,
+            operator: "<",
+            maxScore: 0,
+          },
+        };
+      }
+      return {
+        payload: {
+          scope: [],
+          operator: "=",
+          values: [],
+          size: 0,
         },
-        computed: {
-            deletable() {
-                return _.size(_.filter(this.evaluationItems, item => item.type == ExprEvaluationItemType.IF)) > 1;
-            }
-        },
-        methods: {
-            onAdd() {
-                this.evaluationItems.splice(this.position + 1, 0, {
-                    "id": `Evaluation-Item-${_.now()}-${_.random(0, 9999999)}`,
-                    "type": ExprEvaluationItemType.IF,
-                    "text": {
-                        "zh-CN": ""
-                    },
-                    "conditions": []
-                });
-            },
-            onDelete() {
-                this.evaluationItems.splice(this.position, 1);
-            },
-            addCondition() {
-                this.evaluationItems[this.position].conditions || this.$set(this.evaluationItems[this.position], "conditions", []);
-                this.evaluationItems[this.position].conditions.push({
-                    type: this.exprConditionType,
-                    payload: {
-                        scope: [],
-                        operator: "=",
-                        values: [],
-                        size: 0
-
-                    }
-                });
-            },
-            removeCondition(index) {
-                this.evaluationItems[this.position].conditions.splice(index, 1);
-            },
-            expr(index, value) {
-                _.set(this.evaluationItems[this.position].conditions[index], "expr", value);
-            }
-        }
-    })
+      };
+    },
+    removeCondition(index) {
+      this.evaluationItems[this.position].conditions.splice(index, 1);
+    },
+    expr(index, value) {
+      _.set(
+        this.evaluationItems[this.position].conditions[index],
+        "expr",
+        value
+      );
+    },
+  },
+});
 </script>
 <style scoped lang="less">
-    .mt-base {
-        margin-top: 12px;
-    }
-
-    .action {
-        float: right;
-    }
+.mt-base {
+  margin-top: 12px;
+}
 
-    .input {
-        width: 100px;
-    }
+.action {
+  float: right;
+}
 
-    .label {
-        text-align: right;
-        padding-right: 4px;
-    }
+.input {
+  width: 100px;
+}
 
-    .text {
-        background-color: #ebf7ff;
-        height: 32px;
-        padding: 8px 18px;
-        font-weight: 500;
-        color: #515a6e;
-    }
+.label {
+  text-align: right;
+  padding-right: 4px;
+}
 
-    /deep/ .ivu-card .ivu-form-item {
-        margin-bottom: 4px;
-        margin-top: 0;
-    }
+.text {
+  background-color: #ebf7ff;
+  height: 32px;
+  padding: 8px 18px;
+  font-weight: 500;
+  color: #515a6e;
+}
 
-    /deep/ .ivu-card .ivu-form-item-error {
-        margin-bottom: 24px;
-        margin-top: 0;
+/deep/ .ivu-card .ivu-form-item {
+  margin-bottom: 4px;
+  margin-top: 0;
+}
 
-    }
+/deep/ .ivu-card .ivu-form-item-error {
+  margin-bottom: 24px;
+  margin-top: 0;
+}
 </style>

package/src/components/editor/forms/evaluation/expr/score.vue

@@ -0,0 +1,135 @@
+<template>
+  <Row type="flex" justify="start" :gutter="6" align="middle">
+    <Col class="label">
+      {{
+        t("survey_creator.question.evaluation.condition.score_condition_title")
+      }}
+    </Col>
+    <Col :span="3">
+      <FormItem
+        :prop="`evaluationItems[${itemIndex}].conditions[${index}].payload.minScore`"
+        :rules="{
+          required: true,
+          type: 'number',
+          trigger: 'change',
+          min: 0,
+          max: this.totalScore,
+          message: t('分值不能为空'),
+        }"
+      >
+        <InputNumber
+          v-model="value.minScore"
+          :min="0"
+          :max="value.maxScore"
+          @on-change="rangeChange"
+        ></InputNumber>
+      </FormItem>
+    </Col>
+    <Col class="label">
+      {{ t("survey_creator.question.scores") }}
+    </Col>
+    <Col :span="3">
+      <FormItem
+        :prop="`evaluationItems[${itemIndex}].conditions[${index}].payload.operator`"
+        :rules="{
+          required: true,
+          trigger: 'change',
+          message: t('survey_creator.question.notEmpty'),
+        }"
+      >
+        <Select
+          v-model="value.operator"
+          :placeholder="
+            t('survey_creator.question.evaluation.condition.operator')
+          "
+        >
+          <Option
+            v-for="(operator, index) in operators"
+            :value="operator"
+            :key="index"
+          >
+            {{ operator }}
+          </Option>
+        </Select>
+      </FormItem>
+    </Col>
+    <Col :span="3">
+      <FormItem
+        :prop="`evaluationItems[${itemIndex}].conditions[${index}].payload.maxScore`"
+        :rules="{
+          required: true,
+          type: 'number',
+          trigger: 'change',
+          min: 0,
+          max: this.totalScore,
+          message: t('分值不能为空'),
+        }"
+      >
+        <InputNumber
+          v-model="value.maxScore"
+          :min="value.minScore"
+          :max="totalScore"
+          @on-change="rangeChange"
+        ></InputNumber>
+      </FormItem>
+    </Col>
+    <Col class="label">
+      {{ t("survey_creator.question.scores") }}
+    </Col>
+  </Row>
+</template>
+<script lang="ts">
+import Vue from "vue";
+import { Row, Col, Select, Option, FormItem, InputNumber } from "view-design";
+import _ from "lodash";
+import ExprMixin from "./expr-mixin";
+import LocaleMixin from "../../../../../mixins/locale-mixin";
+
+export default Vue.extend({
+  name: "score",
+  mixins: [ExprMixin, LocaleMixin],
+  components: {
+    Row,
+    Col,
+    Select,
+    Option,
+    FormItem,
+    InputNumber,
+  },
+  data() {
+    return {
+      operators: ["<=", "<"],
+    };
+  },
+  computed: {
+    totalScore() {
+      return this.$rootComponent.currentSurvey.statistics.maxScore;
+    },
+  },
+  methods: {
+    generateExpr() {
+      // let ids = `${_.map(this.value.scope, (e) => {
+      //   return `"` + e + `"`;
+      // })}`;
+      // let answers = `${_.map(this.value.values, (e) => {
+      //   return `"` + e + `"`;
+      // })}`;
+      // return `$count($[id in [${ids}]][answer in [${answers}]]) = ${_.size(
+      //   this.value.scope
+      // )}`;
+      let minScore = this.value.minScore;
+      let maxScore = this.value.maxScore;
+      return `$totalScore ${minScore} ${this.value.operator} ${maxScore}`;
+    },
+    rangeChange() {
+      console.log("222");
+    },
+  },
+});
+</script>
+<style scoped lang="less">
+.label {
+  text-align: right;
+  margin-bottom: 24px;
+}
+</style>

package/src/locale/index.ts

@@ -4,7 +4,7 @@
  */
 import Vue from 'vue'
 import deepmerge from 'deepmerge';
-import defaultLang from './lang/en-US'
+import defaultLang from './lang/zh-CN'
 
 let lang = defaultLang;
 let merged = false;