Browse Source

feat:[模板管理][update]

ouqian
luojie 1 month ago
parent
commit
105c222e9c
4 changed files with 87 additions and 15 deletions
  1. +4
    -2
      src/components/Template/BaseInfoFormPackage.vue
  2. +43
    -1
      src/components/Template/DecimalInput.vue
  3. +9
    -2
      src/components/Template/HandleFormItem.vue
  4. +31
    -10
      src/components/Template/mixins/formPackageMixins.js

+ 4
- 2
src/components/Template/BaseInfoFormPackage.vue View File

@ -123,7 +123,9 @@
:item="sItem" :value="formFields[key]" />
</div>
<!-- 勾选某些选项时出现其他输入框 -->
<div v-else-if="sItem.type === 'radioAndOther'" class="item-center">
<div v-else-if="sItem.type === 'radioAndOther'" class="item-center"
:class="{'form-error-border': errors[key]}"
>
<HandleFormItem :field-item-label="fieldItemLabel" :field-key="prefixKey + '_' + key"
type="radio" :error="errors[key]" @update:error="errors[key] = false"
@change="(e, type) => onSelectChange(key, e, type)" :item="sItem"
@ -133,7 +135,7 @@
:field-key="prefixKey + '_' + sItem.otherCode" @blur="onBlur(key, $event)"
:item="getRadioOtherItem(sItem)" v-model="formFields[sItem.otherCode]"
@copy="onCopy(sItem, key)" :error="errors[sItem.otherCode]"
@update:error="errors[sItem.otherCode] = false"
@update:error="errors[key] = false"
:orange-bg="orangeBgFields[sItem.otherCode]" />
</div>
</div>

+ 43
- 1
src/components/Template/DecimalInput.vue View File

@ -44,7 +44,16 @@ export default {
if (newVal === '' || newVal == null) {
this.internalValue = '';
} else {
this.internalValue = this.handleDecimalDigits(String(newVal));
// "NA" "20/30/40"
if ((this.internalValue && this.internalValue.toUpperCase() === 'NA') || (this.internalValue && /^\d+(\/\d+)*$/.test(this.internalValue))) {
return;
}
// "NA" "20/30/40"
if (String(newVal).toUpperCase() === 'NA' || /^[Nn]?[Aa]?$/.test(String(newVal)) || /^\d+(\/\d*)*$/.test(String(newVal))) {
this.internalValue = String(newVal);
} else {
this.internalValue = this.handleDecimalDigits(String(newVal));
}
}
}
},
@ -56,6 +65,27 @@ export default {
return;
}
// "NA"
if (val.toUpperCase() === 'NA' || /^[Nn]?[Aa]?$/.test(val)) {
this.internalValue = val;
this.$emit('input', val);
return;
}
// "20/30/40"
if (/^\d+(\/\d*)*$/.test(val)) {
this.internalValue = val;
this.$emit('input', val);
return;
}
// "NA" "20/30/40"
if ((this.internalValue && this.internalValue.toUpperCase() === 'NA') || (this.internalValue && /^\d+(\/\d+)*$/.test(this.internalValue))) {
//
this.$emit('input', this.internalValue);
return;
}
// 1.
let cleaned = val
.replace(/[^\d.-]/g, '')
@ -120,6 +150,11 @@ export default {
const actVal = val || this.internalValue;
let finalValue = actVal.trim();
// "NA" "20/30/40"
if (finalValue.toUpperCase() === 'NA' || /^\d+(\/\d+)+$/.test(finalValue)) {
return finalValue;
}
if (finalValue === '' || finalValue === '-') {
this.internalValue = '';
this.$emit('input', '');
@ -150,6 +185,13 @@ export default {
},
handleBlur() {
// "NA" "20/30/40"
if ((this.internalValue && this.internalValue.toUpperCase() === 'NA') || (this.internalValue && /^\d+(\/\d+)*$/.test(this.internalValue))) {
this.$emit('input', this.internalValue);
this.$emit('blur', this.internalValue);
return;
}
let formatted = this.handleDecimalDigits(this.internalValue);
this.internalValue = formatted;
// emit emit

+ 9
- 2
src/components/Template/HandleFormItem.vue View File

@ -1,7 +1,10 @@
<template>
<div class="flex " :class="getFlexClass()">
<div class="flex" :class="getFlexClass()">
<el-input v-if="type === 'input'" :maxlength="item.maxlength || 50" :disabled="getDisabled()"
<!-- @copy.native.capture.prevent="handleFalse"
@cut.native.capture.prevent="handleFalse" -->
<el-input
v-if="type === 'input'" :maxlength="item.maxlength || 50" :disabled="getDisabled()"
:class="getFillTypeStyle() + (orangeBg ? ' orange-bg' : '')" @blur="onBlur"
:placeholder="getPlaceholder()" v-model="inputValue" @input="onInputChange" @change="onInputChange" />
<el-input v-else-if="type === 'textarea'" :maxlength="item.maxlength || 1000" :disabled="getDisabled()"
@ -335,6 +338,7 @@ export default {
}
},
watch: {
value(newVal) {
console.log(newVal, "newVal")
@ -387,6 +391,9 @@ export default {
EventBus.$off("onMixReagentSubmit", this.onMixReagentSubmit)
},
methods: {
handleFalse() {
return false;
},
getFlexClass() {
const noFlexArr = ["radio", "checkboxTag", "fqyq"]
return noFlexArr.includes(this.type) ? '' : 'flex1'
@ -712,7 +719,7 @@ export default {
},
getFillTypeStyle(type) {
const { fillType } = this.item;
const filterType = ["attachment", "checkboxTag", "fqyq", "checkboxTree"]
const filterType = ["attachment", "checkboxTag", "fqyq", "checkboxTree","radio"]
const typeObj = {
actFill: "orange-border",//
green: "green-border",

+ 31
- 10
src/components/Template/mixins/formPackageMixins.js View File

@ -304,17 +304,17 @@ export default {
const o = allFieldsConfig[key];
if (o.otherCode) {//
if (o.type === "select") {
const isSelectedOther = this.isShowOther(formFields[key]);
const isSelectedOther = this.isShowOther(formFields[key],o);
if (!isSelectedOther) {//如果其他选项没有被选择,清空其他字段
formFields[o.otherCode] = "";
}
} else if (o.subType === "select") {
const isSelectedOther = this.isShowOther(formFields[o.subKey]);
const isSelectedOther = this.isShowOther(formFields[o.subKey],o);
if (!isSelectedOther) {//如果其他选项没有被选择,清空其他字段
formFields[o.otherCode] = "";
}
} else if (o.type === "radioAndOther") {
const isSelectedOther = this.isShowOtherByRadioAndOther(formFields[key]);
const isSelectedOther = this.isShowOtherByRadioAndOther(formFields[key],o);
if (!isSelectedOther) {//如果其他选项没有被选择,清空其他字段
formFields[o.otherCode] = "";
}
@ -377,8 +377,6 @@ export default {
//再筛选出需要显示其他输入框的选项
const otherOptions = allCheckedOptions.filter((label)=>isShowOtherByCheckboxTree(label))
const isHasOtherInfo = otherOptions.every(item => otherValues[item]);
console.log(otherOptions,allCheckedOptions,isHasOtherInfo,"otherOptions")
console.log(o,checkedValues,otherValues,options,isChecked,"checkboxTreeValue")
if (!isChecked || !isHasOtherInfo) {
errors.push({
field: key,
@ -388,15 +386,36 @@ export default {
this.$set(this.errors, key, true);
}
continue
}else if(o.type === "radioAndOther"&&o.fillType === this.templateFillType){
const radioValue = formFields[key] || {};
const {otherCode} = o;
const otherValue = formFields[otherCode] || "";
const isShow = this.isShowOtherByRadioAndOther(radioValue,o)
console.log(o,radioValue,isShow,otherValue,"radioValue")
if(isShow&&!otherValue){
errors.push({
field: key,
label: o.label,
error: "请输入信息"
});
this.$set(this.errors, key, true);
}
// if (!radioValue) {
// errors.push({
// field: key,
// label: o.label,
// error: "请选择方法学验证"
// });
// this.$set(this.errors, key, true);
// }
continue
}
if (isValueEmpty(formFields[key])) {
// 其他字段需要判断是否显示再校验
if (o.label === "template.common.other" && !this.isShowOther(formFields[o.parentKey]) && o.parentType !== "radioAndOther") {
continue
}
if (o.type === "radioAndOther" && o.label === "template.common.other" && !this.isShowOtherByRadioAndOther(formFields[o.parentKey])) {
if (o.label === "template.common.other" && !this.isShowOther(formFields[o.parentKey])) {
continue
}
//span的字段不校验
if (o.type === "span" || o.type === "text" || o.type === "button") {
continue
@ -460,7 +479,9 @@ export default {
onBlur(key, val) {
// compareTo 功能:当fillType==="actFill"时,判断当前值是否与compareTo字段的值一样,如果不一样则将当前input框的背景色标记成橙色
this.onValueChangeCompareTo(key, val);
if (this.errors[key]) {
this.$set(this.errors, key, false);
}
this.$emit("blur", { key, value: val, ...this.formFields });
},
onValueChangeCompareTo(key, val, compKey) {

Loading…
Cancel
Save