input的change事件根据placeholder计算公式计算结果

发布时间 2023-08-31 14:20:05作者: 龙旋风
 1 // change事件,根据公式计算
 2 const changeField = (field, data) => {
 3   // change事件 计算公式 徐文龙2023-08-17 晚
 4   let specialChars = /[-+*/)(]/;  // 正则
 5   for (let i = 0; i < person.kpiList.length; i++) {
 6     const element = person.kpiList[i];
 7       // 找到有计算公式的数据
 8     if (!!element["kpiFormula"]) {
 9        //按照正则切割字符串
10       let splitted = person.kpiList[i]["kpiFormula"].split(specialChars);
11       // 去重再大到小排序(复杂到简单排序)
12       splitted = uniqueArray(splitted).reverse();
13       let SetData = {};
14       // 遍历数组 将公式中的数据存贮在一个特殊的对象中
15       for (const iterator of splitted) {
16         for (let j = 0; j < person.kpiList.length; j++) {
17           if (person.kpiList[j]["kpiName"] == iterator) {
18             SetData[iterator] = person.kpiList[j]["name"] ? person.kpiList[j]["name"]: "0";
19             break;
20           }
21         }
22       }
23       //取出公式
24       let setkpiFormula = person.kpiList[i]["kpiFormula"];
25       // 遍历公式中的对象 取属性值和属性名
26       for (const key in SetData) {
27         if (SetData.hasOwnProperty.call(SetData, key)) {
28           // 正则替换 全部替换
29           setkpiFormula = setkpiFormula.replace(RegExp(key, "g"), SetData[key]);
30         }
31       }
32        // 计算公式中的数据
33       let result = eval(setkpiFormula);
34        // 特殊情况没有值 或者无穷大和无穷小 规则避免
35       if (!result || result == -Infinity || result == Infinity) {
36         person.kpiList[i]["name"] = "";
37       } else {
38         // 给数据赋值 为字符串格式,并且四舍五入 保留两位小数
39            person.kpiList[i]["name"] = String(Round(Number(result),2));
40       }
41     }
42   }
43 };
 1  <el-form-item
 2             :label="field.kpiName"
 3             v-for="(field, index) in person.kpiList"
 4             :key="index"
 5           >
 6            <!-- :placeholder="field.kpiFormula" -->
 7             <el-input
 8               clearable
 9               class="input_top"
10               v-model.trim="field.name"
11               placeholder=""
12               :disabled="field.disabled"
13               @change="changeField(field)"
14               oninput ="value=value.replace(/[^0-9.]/g,'')"
15             >
16               {{ field.name }}
17               <template #append style="width: 35px">
18                 <span>{{ field.kpiUnit }}</span>
19               </template>
20             </el-input>
21           </el-form-item>
 1 /**
 2  * 
 3  * @param {any} num 
 4  * @param {number} dec 
 5  * @returns 
 6  * 小数四舍五入
 7  */
 8 export const Round = (num,dec)=>{
 9   let sNum = num + "";
10   let idx = sNum.indexOf(".");
11   if (idx < 0) return num;
12   let n = sNum.length - idx - 1;
13   if (dec < n) {
14     let e = Math.pow(10, dec);
15     return Math.round(num * e) / e;
16   } else {
17     return num;
18   }
19 }