临床数据配置表格添加数值类型增加小数位判断

src/components/clinicalDataQuestions/components/QuestionTableFormItem.vue

@@ -1,125 +1,65 @@
 <template>
   <div class="criterion-form-item">
 
-    <el-form-item
+    <el-form-item :label="`${question.QuestionName}`" :prop="question.Id" :rules="[
-      :label="`${question.QuestionName}`"
+      {
-      :prop="question.Id"
+        required: (question.IsRequired === 0 || (question.IsRequired === 1 && question.RelevanceId && !!~question.RelevanceValueList.indexOf(questionForm[question.RelevanceId]))),
-      :rules="[
+        message: $t('common:ruleMessage:specify'), trigger: ['blur'],
-        { required: (question.IsRequired === 0 || (question.IsRequired ===1 && question.RelevanceId && !!~question.RelevanceValueList.indexOf(questionForm[question.RelevanceId]))),
+        type: question.ClinicalTableQuestionType === 'checkbox' ? 'array' : ''
-          message: $t('common:ruleMessage:specify'), trigger: ['blur'],
+      },
-          type: question.ClinicalTableQuestionType === 'checkbox' ? 'array' : ''},
+    ]"
-      ]"
+      :class="[question.ClinicalTableQuestionType === 'group' ? 'mb' : question.ClinicalTableQuestionType === 'upload' ? 'uploadWrapper' : '']">
-      :class="[question.ClinicalTableQuestionType==='group'?'mb':question.ClinicalTableQuestionType==='upload'?'uploadWrapper':'']"
+      <el-input v-if="question.ClinicalTableQuestionType === 'input'" v-model="questionForm[question.Id]"
-    >
+        :max-length="200" :disabled="question.TableQuestionType === 2" />
-      <el-input
-        v-if="question.ClinicalTableQuestionType==='input'"
-        v-model="questionForm[question.Id]"
-        :max-length="200"
-        :disabled="question.TableQuestionType === 2"
-      />
       <!-- 多行文本输入框 -->
-      <el-input
+      <el-input v-if="question.ClinicalTableQuestionType === 'textarea'" v-model="questionForm[question.Id]"
-        v-if="question.ClinicalTableQuestionType==='textarea'"
+        :max-length="200" type="textarea" :autosize="{ minRows: 2, maxRows: 4 }" />
-        v-model="questionForm[question.Id]"
-        :max-length="200"
-        type="textarea"
-        :autosize="{ minRows: 2, maxRows: 4}"
-      />
       <!-- 下拉框 -->
-      <el-select
+      <el-select v-if="question.ClinicalTableQuestionType === 'select'" v-model="questionForm[question.Id]" clearable
-        v-if="question.ClinicalTableQuestionType==='select'"
+        :disabled="(question.TableQuestionType === 2 || question.QuestionGenre === 2) && !!question.DictionaryCode">
-        v-model="questionForm[question.Id]"
-        clearable
-        :disabled="(question.TableQuestionType === 2 || question.QuestionGenre === 2) && !!question.DictionaryCode"
-      >
         <template v-if="question.TableQuestionType === 1">
-          <el-option
+          <el-option v-for="item in organList" :key="item.Id" :label="item[question.DataTableColumn]"
-            v-for="item in organList"
+            :value="item[question.DataTableColumn]" />
-            :key="item.Id"
-            :label="item[question.DataTableColumn]"
-            :value="item[question.DataTableColumn]"
-          />
         </template>
         <template v-else-if="question.TableQuestionType === 3 || question.QuestionGenre === 3">
-          <el-option
+          <el-option v-for="item of $d[question.DictionaryCode]" :key="item.id" :value="item.value"
-            v-for="item of $d[question.DictionaryCode]"
+            :label="item.label" />
-            :key="item.id"
-            :value="item.value"
-            :label="item.label"
-          />
         </template>
-        <template v-else-if="(question.TableQuestionType === 2 || question.QuestionGenre === 2) && question.DictionaryCode">
+        <template
-          <el-option
+          v-else-if="(question.TableQuestionType === 2 || question.QuestionGenre === 2) && question.DictionaryCode">
-            v-for="item of $d[question.DictionaryCode]"
+          <el-option v-for="item of $d[question.DictionaryCode]" :key="item.id" :value="item.value"
-            :key="item.id"
+            :label="item.label" />
-            :value="item.value"
-            :label="item.label"
-          />
         </template>
         <template v-else>
-          <el-option
+          <el-option v-for="val in question.TypeValue.split('|')" :key="val" :label="val" :value="val" />
-            v-for="val in question.TypeValue.split('|')"
-            :key="val"
-            :label="val"
-            :value="val"
-          />
         </template>
 
       </el-select>
       <!-- 单选 -->
-      <el-date-picker
+      <el-date-picker v-if="question.ClinicalTableQuestionType === 'time'" v-model="questionForm[question.Id]"
-        v-if="question.ClinicalTableQuestionType === 'time'"
+        format="yyyy-MM-dd" value-format="yyyy-MM-dd" style="width: 200px" align="right" type="date" />
-        v-model="questionForm[question.Id]"
-        format="yyyy-MM-dd"
-        value-format="yyyy-MM-dd"
-        style="width: 200px"
-        align="right"
-        type="date"
-      />
       <!-- 单选 -->
-      <el-radio-group
+      <el-radio-group v-if="question.ClinicalTableQuestionType === 'radio'" v-model="questionForm[question.Id]"
-        v-if="question.ClinicalTableQuestionType==='radio'"
+        @change="((val) => { formItemChange(val, question) })">
-        v-model="questionForm[question.Id]"
-        @change="((val)=>{formItemChange(val, question)})"
-      >
         <template v-if="question.DictionaryCode">
-          <el-radio
+          <el-radio v-for="item of $d[question.DictionaryCode]" :key="item.id" :label="item.value">
-            v-for="item of $d[question.DictionaryCode]"
-            :key="item.id"
-            :label="item.value"
-          >
             {{ item.label }}
           </el-radio>
         </template>
         <template v-if="question.TypeValue">
-          <el-radio
+          <el-radio v-for="val in question.TypeValue.split('|')" :key="val" :label="val">
-            v-for="val in question.TypeValue.split('|')"
-            :key="val"
-            :label="val"
-          >
             {{ val }}
           </el-radio>
         </template>
       </el-radio-group>
       <!-- 复选框 -->
-      <el-checkbox-group
+      <el-checkbox-group v-if="question.ClinicalTableQuestionType === 'checkbox'" v-model="questionForm[question.Id]">
-        v-if="question.ClinicalTableQuestionType==='checkbox'"
+        <el-checkbox v-for="val in question.TypeValue.split('|')" :key="val" :label="val">
-        v-model="questionForm[question.Id]"
-      >
-        <el-checkbox
-          v-for="val in question.TypeValue.split('|')"
-          :key="val"
-          :label="val"
-        >
           {{ val }}
         </el-checkbox>
       </el-checkbox-group>
-      <el-input
+      <el-input v-if="question.ClinicalTableQuestionType === 'number'" v-model="questionForm[question.Id]" type="number"
-        v-if="question.ClinicalTableQuestionType === 'number'"
+        @input="limitInput($event, questionForm, question)" style="width: 200px">
-        v-model="questionForm[question.Id]"
-        type="number"
-        style="width: 200px"
-      >
         <template v-if="question.Unit" slot="append">{{ question.Unit }}</template>
       </el-input>
     </el-form-item>
@@ -187,6 +127,14 @@ export default {
     }
   },
   methods: {
+    limitInput(value, form, row) {
+      if (value.indexOf('.') > -1) {
+        if (value.split('.')[1].length >= row.DigitPlaces) {
+          this.$set(form, row.Id, parseFloat(value).toFixed(row.DigitPlaces))
+        }
+      }
+      this.$forceUpdate()
+    },
     save() {
     },
     openAddTableCol(row) {
@@ -220,34 +168,40 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-.my_dialog{
+.my_dialog {
-  .criterion-form-item{
+  .criterion-form-item {
-    ::v-deep .el-form-item__content{
+    ::v-deep .el-form-item__content {
       width: auto;
     }
   }
 }
-.criterion-form-item{
+
-  .el-form-item{
+.criterion-form-item {
+  .el-form-item {
     display: flex;
     flex-direction: row;
     align-items: flex-start;
   }
-  ::v-deep .el-form-item__content{
+
+  ::v-deep .el-form-item__content {
     width: 500px;
   }
-  .el-input{
+
-    width:100%;
+  .el-input {
+    width: 100%;
   }
-  .mb{
+
+  .mb {
     margin-bottom: 0px;
   }
-  .disabled{
+
+  .disabled {
     ::v-deep .el-upload--picture-card {
       display: none;
     }
   }
-  .uploadWrapper{
+
+  .uploadWrapper {
     display: flex;
     flex-direction: column;
     align-items: flex-start;