检查计费公式的校验，常用符号不能相邻，被除数不能为0,可选数据不能相邻等逻辑校验

haoxuan

2024-04-25 6d837c791e3c303e9176575559a2bb41af6154f5

检查计费公式的校验，常用符号不能相邻，被除数不能为0,可选数据不能相邻等逻辑校验

 src/views/employeeSalary/salaryPlan/components/addDialog.vue

@@ -30,7 +30,7 @@
              v-for="item in workTypeList"
              :key="item.ID"
              :label="item.workName"
              :value="item"
              :value="{ value: item.ID, label: item.workName }"
            >
            </el-option>
          </el-select>
@@ -55,21 +55,27 @@
            @click="handleUnitShow"
          ></i>
        </el-form-item>
        <el-form-item prop="salaryFormula" label="计费公式定义">
        <el-form-item prop="salaryFormulaHtml" label="计费公式定义">
          <!-- <el-input
            type="textarea"
            :autosize="{ minRows: 4, maxRows: 6}"
            disabled
            placeholder="请输入内容"
            v-model="form.salaryFormula"
            v-model="form.salaryFormulaHtml"
          >
          </el-input> -->
          <div class="formula-input" v-html="form.salaryFormula"></div>
          <el-button class='formula-btn' type="text" @click="checkFormula()">检查公式</el-button>
          <div class="formula-input" v-html="form.salaryFormulaHtml"></div>
          <el-button class="formula-btn" type="text" @click="checkFormula()"
            >检查公式</el-button
          >
        </el-form-item>
        <div class="formula-error" >
         <span v-if="form.error==1"> 无错误，可放心使用 ! </span>
         <span v-if="form.error==2"> 公式有错误，请检查 ! </span>
        <div class="formula-error">
          <span v-if="form.error == 1" class="color_blue">
            无错误，可放心使用 !
          </span>
          <span v-if="form.error == 2" class="color_red">
            公式有错误，请检查 !
          </span>
        </div>
        <div class="formula-box">
          <div class="table-bottom-tabs">
@@ -97,35 +103,51 @@
          <div class="formula-bottom-box">
            <div class="formula-l">
              <div class="formula-p">可选数据</div>
              <div class="formula-bottom" v-if="activeName==1">
                <div  :class="item.width==2?'formula-item-100':'formula-item'" v-for='item in formulaName' :key="item.name">
              <div class="formula-bottom" v-if="activeName == 1">
                <div
                  :class="item.width == 2 ? 'formula-item-100' : 'formula-item'"
                  v-for="item in formulaName"
                  :key="item.name"
                >
                  <span @click="formulaClick(item)"> {{ item.name }}</span>
                    <i
                      v-if="item.type==1"
                      class="el-icon-setting margin_left_5px  cursor_pointer"
                      style="font-size: 18px; color: gray"
                      @click="handleSlikSetShow"
                    ></i>
                  <i
                    v-if="item.type == 1"
                    class="el-icon-setting margin_left_5px cursor_pointer"
                    style="font-size: 18px; color: gray"
                    @click="handleSlikSetShow"
                  ></i>
                </div>
              </div>
              <div class="formula-bottom" v-if="activeName==2">
                <div  :class="item.width==2?'formula-item-100':'formula-item'" v-for='item in formulaNameTwo' :key="item.name">
                 <span @click="formulaClick(item)"> {{ item.name }}</span>
                 <i
                      v-if="item.type==2"
                      class="el-icon-setting margin_left_5px  cursor_pointer"
                      style="font-size: 18px; color: gray"
                      @click="handleConstSetShow(2)"
                    ></i>
              <div class="formula-bottom" v-if="activeName == 2">
                <div
                  :class="item.width == 2 ? 'formula-item-100' : 'formula-item'"
                  v-for="item in formulaNameTwo"
                  :key="item.name"
                >
                  <span @click="formulaClick(item)"> {{ item.name }}</span>
                  <i
                    v-if="item.type == 2"
                    class="el-icon-setting margin_left_5px cursor_pointer"
                    style="font-size: 18px; color: gray"
                    @click="handleConstSetShow(2)"
                  ></i>
                </div>
              </div>
            </div>
            <div class="formula-r">
              <div class="formula-p">常用符号/产量</div>
              <div class="formula-bottom">
                <div  :class="item.width==2?'formula-item-100':'formula-item'" v-for='item in formulaSymbol' :key="item.name">
                  <span v-if="item.type==3" @click="handleConstSetShow(3)"> {{ item.name }}</span>
                  <span v-else @click="formulaClick(item)"> {{ item.name }}</span>
                <div
                  :class="item.width == 2 ? 'formula-item-100' : 'formula-item'"
                  v-for="item in formulaSymbol"
                  :key="item.name"
                >
                  <span v-if="item.type == 3" @click="handleConstSetShow(3)">
                    {{ item.name }}</span
                  >
                  <span v-else @click="formulaClick(item)">
                    {{ item.name }}</span
                  >
                </div>
              </div>
            </div>
@@ -154,7 +176,7 @@
      @confirmValueSave="confirmValueSave"
      :constType="constType"
      :editRow="form"
      :title="constType==2?'配置':'输入'"
      :title="constType == 2 ? '配置' : '输入'"
    ></ConstantSetDialog>
  </div>
</template>
@@ -167,14 +189,14 @@
} from "@/api/employeeSalary/salaryPlan.js";
import { getWorkTypeList } from "@/api/employeeManage/employeeInfo.js";
import BomDialog from "@/views/employeeSalary/salaryPlan/components/bomDialog.vue";
import SilkSetDialog from "@/views/employeeSalary/salaryPlan/components/SilkSetDialog.vue"; 
import ConstantSetDialog from "@/views/employeeSalary/salaryPlan/components/ConstantSetDialog.vue"; 
import SilkSetDialog from "@/views/employeeSalary/salaryPlan/components/SilkSetDialog.vue";
import ConstantSetDialog from "@/views/employeeSalary/salaryPlan/components/ConstantSetDialog.vue";
export default {
  components: { 
  components: {
    BomDialog,
    SilkSetDialog,
    ConstantSetDialog
   },
    ConstantSetDialog,
  },
  props: {
    editRow: {
      type: Object,
@@ -188,91 +210,92 @@
        workTypes: [],
        salaryType: "",
        salaryFormula: "",
        error:'',
        purchaseTypeList:[1],
        cycle:1,
        salaryFormulaHtml: "",
        error: "",
        purchaseTypeList: [1],
        cycle: '1',
      },
      activeName: 1,
      formulaName:[
      formulaName: [
        {
          name:'日产丝量',
          name: "日产丝量",
        },
        {
          name:'野纤数量',
          type:1,
          name: "野纤数量",
          type: 1,
        },
        {
          name:'生丝单价',
          name: "生丝单价",
        },
        {
          name:'野纤单价',
          name: "野纤单价",
        },
        {
          name:'桶数(日)',
          name: "桶数(日)",
        },
        {
          name:'出勤天数',
          name: "出勤天数",
        },
        {
          name:'同组挡车工月平均工资',
          width:2
          name: "同组挡车工月平均工资",
          width: 2,
        },
        {
          name:'同组车头工工资',
          width:2
        }
      ],
      formulaNameTwo:[
        {
          name:'工作日加班时长',
        },
        {
          name:'满勤奖',
          type:2,
        },
        {
          name:'休息日加班时长',
        },
        {
          name:'请假天数',
        },
        {
          name:'带徒天数',
        },
        {
          name:'工龄',
        },
        {
          name:'出勤天数',
          name: "同组车头工工资",
          width: 2,
        },
      ],
      formulaSymbol:[
      formulaNameTwo: [
        {
          name:'+',
          background:'background_red',
          name: "工作日加班时长",
        },
        {
          name:'-',
          background:'background_red',
          name: "满勤奖",
          type: 2,
        },
        {
          name:'/',
          background:'background_red',
          name: "休息日加班时长",
        },
        {
          name:'*',
          background:'background_red',
          name: "请假天数",
        },
        {
          name:'(',
          name: "带徒天数",
        },
        {
          name:')',
          name: "工龄",
        },
        {
          name:'常量数字',
          type:3,
          width:2
          name: "出勤天数",
        },
      ],
      formulaSymbol: [
        {
          name: "+",
          background: "background_red",
        },
        {
          name: "-",
          background: "background_red",
        },
        {
          name: "/",
          background: "background_red",
        },
        {
          name: "*",
          background: "background_red",
        },
        {
          name: "(",
        },
        {
          name: ")",
        },
        {
          name: "常量数字",
          type: 3,
          width: 2,
        },
      ],
      workTypeList: [], //工种
@@ -290,12 +313,12 @@
        salaryType: [
          { required: true, message: "请选择", trigger: ["blur", "change"] },
        ],
        salaryFormula: [
        salaryFormulaHtml: [
          { required: true, message: "请选择", trigger: ["blur", "change"] },
        ],
      },
      unitList: [],
      constType:'',
      constType: "",
    };
  },
  computed: {},
@@ -319,40 +342,107 @@
      this.activeName = activeName;
    },
    // 点击生产数据和考勤及补贴数据 赋值计费公式定义
    formulaClick(item,value){
      let string=''
      let name=(item.type==3&&item.name=='常量数字')?value:item.name
      if(item.background){
        string="<span class='formula-input-item background_red color_fff'>"+ name +"</span>"
      }else{
        string="<span class='formula-input-item background_e3e3e3'>"+ name +"</span>"
    formulaClick(item, value) {
      let string = "";
      let name = item.type == 3 && item.name == "常量数字" ? value : item.name;
      if (item.background) {
        string =
          "<span class='formula-input-item background_red color_fff'>" +
          name +
          "</span>";
      } else {
        string =
          "<span class='formula-input-item background_e3e3e3'>" +
          name +
          "</span>";
      }
      this.form.salaryFormula= this.form.salaryFormula+string;
      this.$forceUpdate()
      this.form.salaryFormula = this.form.salaryFormula + name + "，";
      this.form.salaryFormulaHtml = this.form.salaryFormulaHtml + string;
      this.$forceUpdate();
    },
    checkFormula(){
    checkFormula() {
      if (this.form.salaryFormula) {
        let string = true;
        let isString = '+-*/';
        let arr = this.form.salaryFormula.split("，");
        arr=arr.splice(0,arr.length-1)
        for (let i=0;i<arr.length;i++) {
          if (arr[i] != "") {
            // 除数不能为0, 符号那边需要有值
            if (isString.indexOf(arr[i]) != -1 || arr[i] == "(") {
              if (i != 0) {
                if (isString.indexOf(arr[i - 1]) != -1) {
                  string = false;
                  break;
                }
              }
              if (i == arr.length - 1) {
                string = false;
                break;
              }
              if (i < arr.length - 1) {
                if (isString.indexOf(arr[i + 1]) != -1) {
                  string = false;
                  break;
                } else if (arr[i] == "/" && arr[i + 1] == 0) {
                  string = false;
                  break;
                }
              }
            } else if (arr[i] == ")") {
              if (i < arr.length - 1) {
                if (isString.indexOf(arr[i+1]) == -1) {
                  string = false;
                  break;
                }
              }
            } else {
              if (i != 0) {
                if (isString.indexOf(arr[i - 1]) == -1 && arr[i - 1] != "(") {
                  string = false;
                  break;
                }
              }
              if (i < arr.length - 1) {
                if (isString.indexOf(arr[i + 1]) == -1 && arr[i + 1] != ")") {
                  string = false;
                  break;
                }
              }
            }
          }
        }

        if (!string) {
          this.form.error = 2;
        } else {
          this.form.error = 1;
        }
      }
    },
    confirmValueSave(form,type){
      if(type==1){
        this.form.purchaseTypeList=form.purchaseTypeList;
      }else if(type==2){
        this.form.cycle=form.cycle
      }else if(type==3){
        this.formulaClick({
          name:'常量数字',
          type:3,
          width:2
        },form.number)
    confirmValueSave(form, type) {
      if (type == 1) {
        this.form.purchaseTypeList = form.purchaseTypeList;
      } else if (type == 2) {
        this.form.cycle = form.cycle+'';
      } else if (type == 3) {
        this.formulaClick(
          {
            name: "常量数字",
            type: 3,
            width: 2,
          },
          form.number
        );
      }
    },
    // 野纤数量
    handleSlikSetShow(){
    handleSlikSetShow() {
      this.$refs.silkSetDialog.islook = true;
    },
    // 满勤奖
    handleConstSetShow(val){
      this.constType=val;
    handleConstSetShow(val) {
      this.constType = val;
      this.$refs.constantSetDialog.islook = true;
    },
    // 单位
@@ -387,9 +477,10 @@
          workTypes: [],
          salaryType: "",
          salaryFormula: "",
          error:'',
          purchaseTypeList:[1],
          cycle:1,
          salaryFormulaHtml: "",
          error: "",
          purchaseTypeList: [1],
          cycle: '1',
        };
        this.$nextTick(() => {
          this.$refs["form"].resetFields();
@@ -421,8 +512,11 @@
      this.$refs[formName].validate((valid) => {
        if (valid) {
          let form = JSON.parse(JSON.stringify(this.form));
          if(form.purchaseTypeList.length==0){
            this.$message.error('请点击野纤数量配置生丝标准！')
          let arr = form.salaryFormula.split("，");
           arr=arr.splice(0,arr.length-1)
           form.salaryFormula=arr.join("，")
          if (form.purchaseTypeList.length == 0) {
            this.$message.error("请点击野纤数量配置生丝标准！");
            return true;
          }
          saveSalaryPlan(form).then((res) => {
@@ -448,78 +542,81 @@
  width: 90%;
  margin-bottom: 40px;
  margin: 0 auto;
  .formula-box{
    height:auto;
    width:calc(100% - 110px);
    font-size:14px;
    line-height:25px;
    padding-left:110px;
    .formula-bottom-box{
      width:100%;
      height:auto;
      overflow:hidden;
      margin-bottom:30px;
      .formula-p{
        line-height:40px;
  .formula-box {
    height: auto;
    width: calc(100% - 110px);
    font-size: 14px;
    line-height: 25px;
    padding-left: 110px;
    .formula-bottom-box {
      width: 100%;
      height: auto;
      overflow: hidden;
      margin-bottom: 30px;
      .formula-p {
        line-height: 40px;
      }
      .formula-l,.formula-r{
        height:auto;
        float:left;
      .formula-l,
      .formula-r {
        height: auto;
        float: left;
      }
      .formula-l{
        width:calc(75% - 10px);
        margin-right:20px;
      .formula-l {
        width: calc(75% - 10px);
        margin-right: 20px;
      }
      .formula-r{
        width:calc(25% - 10px);
      .formula-r {
        width: calc(25% - 10px);
      }
      .formula-item-100{
        width:100%;
        margin-bottom:10px;
        span{
      .formula-item-100 {
        width: 100%;
        margin-bottom: 10px;
        span {
          cursor: pointer;
          padding:5px 10px;
          padding: 5px 10px;
        }
      }
      .formula-item{
        width:calc(50% - 5px);
        margin-bottom:10px;
        float:left;
      .formula-item {
        width: calc(50% - 5px);
        margin-bottom: 10px;
        float: left;
        &:nth-of-type(odd) {
          margin-right: 10px;
        }
        span{
        span {
          cursor: pointer;
          padding:5px 10px;
          padding: 5px 10px;
        }
      }
      .formula-bottom{
        padding:15px 10px;
        background:#f3f3f3;
        overflow:hidden;
      .formula-bottom {
        padding: 15px 10px;
        background: #f3f3f3;
        overflow: hidden;
      }
    }
  }
  .formula-input{
      width:calc(100% - 100px);
      height:100px;
      padding:10px 10px;
      overflow-y:auto;
      background:#F5F7FA;
      border:1px solid #E4E7ED;
      cursor:not-allowed;
      float:left;
      margin-right:20px;
    }
    .formula-btn{
      float:left;
      margin-top:80px;
    }
    .formula-error{
      width:100%;
      line-height:28px;
      font-size:12px;
    }
  .formula-input {
    width: calc(100% - 100px);
    height: 100px;
    padding: 10px 10px;
    overflow-y: auto;
    background: #f5f7fa;
    border: 1px solid #e4e7ed;
    cursor: not-allowed;
    float: left;
    margin-right: 20px;
  }
  .formula-btn {
    float: left;
    margin-top: 80px;
  }
  .formula-error {
    width: calc(100% - 110px);
    line-height: 28px;
    font-size: 14px;
    margin-left: 110px;
    margin-bottom: 10px;
  }
}

::v-deep {