车间管理 修改完成之后，再次打开 爆红的问题修改+新建薪资方案的前端开发+

haoxuan

2024-04-25 b2c2a77b5632b7e5f29a6cdce816bd977bc8604d

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

@@ -56,15 +56,21 @@
          ></i>
        </el-form-item>
        <el-form-item prop="salaryFormula" label="计费公式定义">
          <el-input
          <!-- <el-input
            type="textarea"
            :autosize="{ minRows: 4, maxRows: 6}"
            disabled
            placeholder="请输入内容"
            v-model="form.salaryFormula"
          >
          </el-input>
          </el-input> -->
          <div class="formula-input" v-html="form.salaryFormula"></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>
        <div class="formula-box">
          <div class="table-bottom-tabs">
            <div
@@ -93,12 +99,24 @@
              <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">
                 <span @click="formulaClick(item)"> {{ item.name }}</span>
                  <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>
                </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>
              </div>
            </div>
@@ -106,7 +124,8 @@
              <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 @click="formulaClick(item)"> {{ item.name }}</span>
                  <span v-if="item.type==3" @click="handleConstSetShow(3)"> {{ item.name }}</span>
                  <span v-else @click="formulaClick(item)"> {{ item.name }}</span>
                </div>
              </div>
            </div>
@@ -124,6 +143,19 @@
      :workList="unitList"
      title="计量单位"
    ></BomDialog>
    <SilkSetDialog
      ref="silkSetDialog"
      @confirmValueSave="confirmValueSave"
      :editRow="form"
      title="配置"
    ></SilkSetDialog>
    <ConstantSetDialog
      ref="constantSetDialog"
      @confirmValueSave="confirmValueSave"
      :constType="constType"
      :editRow="form"
      :title="constType==2?'配置':'输入'"
    ></ConstantSetDialog>
  </div>
</template>

@@ -135,8 +167,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"; 
export default {
  components: { BomDialog },
  components: { 
    BomDialog,
    SilkSetDialog,
    ConstantSetDialog
   },
  props: {
    editRow: {
      type: Object,
@@ -144,12 +182,15 @@
  },
  data() {
    return {
      islook: true,
      islook: false,
      form: {
        name: "",
        workTypes: [],
        salaryType: "",
        salaryFormula: "",
        error:'',
        purchaseTypeList:[1],
        cycle:1,
      },
      activeName: 1,
      formulaName:[
@@ -187,7 +228,7 @@
        },
        {
          name:'满勤奖',
          type:1,
          type:2,
        },
        {
          name:'休息日加班时长',
@@ -208,15 +249,19 @@
      formulaSymbol:[
        {
          name:'+',
          background:'background_red',
        },
        {
          name:'-',
          background:'background_red',
        },
        {
          name:'/',
          background:'background_red',
        },
        {
          name:'*',
          background:'background_red',
        },
        {
          name:'(',
@@ -226,7 +271,7 @@
        },
        {
          name:'常量数字',
          type:1,
          type:3,
          width:2
        },
      ],
@@ -250,6 +295,7 @@
        ],
      },
      unitList: [],
      constType:'',
    };
  },
  computed: {},
@@ -271,6 +317,43 @@
  methods: {
    tabClickBottom(activeName) {
      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>"
      }
      this.form.salaryFormula= this.form.salaryFormula+string;
      this.$forceUpdate()
    },
    checkFormula(){

    },
    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(){
      this.$refs.silkSetDialog.islook = true;
    },
    // 满勤奖
    handleConstSetShow(val){
      this.constType=val;
      this.$refs.constantSetDialog.islook = true;
    },
    // 单位
    handleUnitShow() {
@@ -304,15 +387,14 @@
          workTypes: [],
          salaryType: "",
          salaryFormula: "",
          error:'',
          purchaseTypeList:[1],
          cycle:1,
        };
        this.$nextTick(() => {
          this.$refs["form"].resetFields();
          if (this.editRow.id) {
            this.form = JSON.parse(JSON.stringify(this.editRow));
            this.form.groupNumber = this.form.groupNumber
              ? this.form.groupNumber
              : null;
            this.getGroupNumber(true);
          }
        });
      }
@@ -339,6 +421,10 @@
      this.$refs[formName].validate((valid) => {
        if (valid) {
          let form = JSON.parse(JSON.stringify(this.form));
          if(form.purchaseTypeList.length==0){
            this.$message.error('请点击野纤数量配置生丝标准！')
            return true;
          }
          saveSalaryPlan(form).then((res) => {
            if (res.code == 200) {
              this.$message({
@@ -372,6 +458,7 @@
      width:100%;
      height:auto;
      overflow:hidden;
      margin-bottom:30px;
      .formula-p{
        line-height:40px;
      }
@@ -412,8 +499,27 @@
        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;
    }
}

::v-deep {