conp.vue 9.68 KB
<template>
    <div class="eibs-tab">
        <!-- 第一行 -->
        <c-col :span="24">
            <c-col :span="12" style="padding-right: 20px">
                <c-col :span="24">
                    <el-form-item label="国内外汇贷款编号" prop="cfabop.cfaeca.recgrp.bas.dofoexlocode">
                        <c-input disabled maxlength="28" placeholder="请输入国内外汇贷款编号"
                                 v-model="model.recgrp.bas.dofoexlocode"></c-input>
                    </el-form-item>
                </c-col>

                <c-col :span="24">
                    <el-form-item label="操作类型" prop="cfabop.cfaeca.recgrp.bas.actiontype">
                        <c-select clearable dbCode="action" disabled placeholder="请输入操作类型"
                                  style="width:100%" v-model="model.recgrp.bas.actiontype">
                        </c-select>
                    </el-form-item>
                </c-col>
            </c-col>

            <c-col :span="12" style="padding-left: 20px">
                <c-col :span="24">
                    <el-form-item label="删除原因" prop="cfabop.cfaeca.recgrp.bas.actiondesc">
                        <c-input :disabled="disflgobj.actiondesc == 'X'" maxlength="128" placeholder="请输入删除原因" show-word-limit
                                 type="textarea" :rows="4"
                                 v-model="model.recgrp.bas.actiondesc"></c-input>
                    </el-form-item>
                </c-col>
            </c-col>

        </c-col>

        <c-col :span="24">
            <!-- 第二行开始  左侧列 -->
            <c-col :span="12" style="padding-right: 20px">
                <c-col :span="24">
                    <el-form-item label="债权人代码" prop="cfabop.cfaeca.recgrp.bas.creditorcode">
                        <c-input :disabled="disflgobj.creditorcode == 'X'" placeholder="请输入债权人代码" maxlength="12" v-model="model.recgrp.bas.creditorcode"></c-input>
                    </el-form-item>
                </c-col>

                <c-col :span="24">
                    <el-form-item label="起息日" prop="cfabop.cfaeca.recgrp.bas.valuedate">
                        <c-date-picker :disabled="disflgobj.valuedate == 'X'" placeholder="请输入起息日" style="width:100%" type="date"
                                       v-model="model.recgrp.bas.valuedate" value-format="yyyy-MM-dd">
                        </c-date-picker>
                    </el-form-item>
                </c-col>

                <c-col :span="24">
                    <el-form-item label="到期日" prop="cfabop.cfaeca.recgrp.bas.maturity">
                        <c-date-picker :disabled="disflgobj.maturity == 'X'" placeholder="请输入到期日" style="width:100%" type="date"
                                       v-model="model.recgrp.bas.maturity" value-format="yyyy-MM-dd">
                        </c-date-picker>
                    </el-form-item>
                </c-col>

                <c-col :span="24">
                    <el-form-item label="贷款币种" prop="cfabop.cfaeca.recgrp.bas.currence">
                        <c-select dbCode="curtxt" :disabled="disflgobj.currence == 'X'" placeholder="请输入贷款币种"
                                  v-model="model.recgrp.bas.currence">
                        </c-select>
                    </el-form-item>
                </c-col>

                <c-col :span="24">
                    <el-form-item label="签约金额" prop="cfabop.cfaeca.recgrp.bas.contractamount">
                        <c-input-currency  :disabled="disflgobj.contractamount == 'X'" placeholder="请输入签约金额" :maxlength="23"
                                          v-model="model.recgrp.bas.contractamount"></c-input-currency>
                    </el-form-item>
                </c-col>

                <c-col :span="24">
                    <el-form-item label="备注" prop="cfabop.cfaeca.recgrp.bas.remark">
                        <c-input maxlength="248" :disabled="disflgobj.remark == 'X'"  placeholder="请输入备注" show-word-limit type="textarea"
                                 v-model="model.recgrp.bas.remark">
                        </c-input>
                    </el-form-item>
                </c-col>


            </c-col>

            <!-- 第二行开始  右侧列 -->
            <c-col :span="12" style="padding-left: 20px">
                <c-col :span="24">
                    <el-form-item label="债务人代码" prop="cfabop.cfaeca.recgrp.bas.debtorcode">
                        <c-input placeholder="请输入债务人代码" :disabled="disflgobj.debtorcode == 'X'" maxlength="18"
                                 v-model="model.recgrp.bas.debtorcode"></c-input>
                    </el-form-item>
                </c-col>

                <c-col :span="24">
                    <el-form-item label="债务人中文名称" prop="cfabop.cfaeca.recgrp.bas.debtorname">
                        <c-input maxlength="90" :disabled="disflgobj.debtorname == 'X'" placeholder="请输入债务人中文名称" style="width:100%"
                                 v-model="model.recgrp.bas.debtorname">
                        </c-input>
                    </el-form-item>
                </c-col>

                <c-col :span="24" class="custom-box-wrap">
                <div class="box-1">
                  <div style="width: 100%">
                    <el-form-item label="国内外汇贷款类型" prop="cfabop.cfaeca.recgrp.bas.dofoexlotype">
                        <c-select dbCode="doftyp" :disabled="disflgobj.dofoexlotype == 'X'" placeholder="请输入国内外汇贷款类型" style="width:100%"
                                  v-model="model.recgrp.bas.dofoexlotype" isShowKeyAndLabel>
                        </c-select>
                    </el-form-item>
                    </div>
                   </div>

                    <div class="box-2">
                      <c-checkbox
                        disabled
                        true-label=""
                        false-label="X"
                        class="checkbox-left"
                        >确认</c-checkbox
                      >
                  </div>
                </c-col>

                <c-col :span="24">
                    <el-form-item label="转贷项目名称" prop="cfabop.cfaeca.recgrp.bas.lenproname">
                        <c-input placeholder="请输入转贷项目名称" :disabled="disflgobj.lenproname == 'X'"  maxlength="90" 
                                 v-model="model.recgrp.bas.lenproname"></c-input>
                    </el-form-item>
                </c-col>

                <c-col :span="24">
                    <el-form-item label="转贷协议号" prop="cfabop.cfaeca.recgrp.bas.lenagree">
                        <c-input placeholder="请输入转贷协议号" :disabled="disflgobj.lenagree == 'X'" maxlength="90" 
                                 v-model="model.recgrp.bas.lenagree"></c-input>
                    </el-form-item>
                </c-col>

                <c-col :span="24">
                    <el-form-item class="intrat" label="年化利率值" prop="cfabop.cfaeca.recgrp.bas.anninrate">
                        <c-input-currency placeholder="请输入年化利率值" :disabled="disflgobj.anninrate == 'X'" style="width:100%" :precision=8
                                 v-model="model.recgrp.bas.anninrate">
                        </c-input-currency>
                    </el-form-item>
                </c-col>

            </c-col>

        </c-col>

    </div>
</template>
<script>

    export default {
        inject: ["root"],
        props: {
            model: {
                type: Object,
                default: undefined,
            },
            codes: {},
            
        },
        data() {
            return {
                allitem: ["actiondesc","creditorcode","valuedate","maturity","currence","contractamount","remark","debtorcode","debtorname","dofoexlotype","lenproname","lenagree","anninrate"],
                enableitem:  ["debtorcode","debtorname","dofoexlotype","lenproname","lenagree","remark"],
                disflgobj: {},
            };
        },
        methods: {
            //需要控制字段是否可编辑
       disableByItem(){
          //遍历字段名数组,设置可编辑标志 X
          this.allitem.forEach((filedname,index) => {
              let disflg = 'X';
              let trnname = this.root.trnName.slice(0,6);
              let trntyp = trnname.slice(0,3);
              let basflg = this.root.model.cfabop.cfaeca.basflg;
              //01 维护交易 新增 修改 字段均需要可编辑
             if(trnname === 'ecaadd' || (trnname === 'ecaame')){
                disflg = 'N';
             }

             //02 签约勾选的前提下 业务交易部分字段可编辑 
          if(basflg ==='X' && trntyp !== 'eca' &&  this.enableitem.includes(filedname)){
              disflg = 'N';
          }

          //03 特殊化处理删除原因 只有删除交易操作类型为删除的情况下才能编辑
          if(filedname === 'actiondesc'){
              if(trnname === 'ecadel' && basflg ==='X' && this.root.model.cfabop.cfaeca.recgrp.bas.actiontype =='D'){
                  disflg = 'N';
              }
          }


          // 标志赋值
          this.$set(this.disflgobj,filedname,disflg);

          });
          
      },
        },
        mounted() {
            //初始化字段是否可编辑
            this.disableByItem();
            console.log(this.disflgobj);
        },
        computed: {},
        watch: {},
        created: function () {
        }
    };
</script>
<style lang="less" scoped>
    .intrat /deep/ .el-input__inner {
        text-align: left;
    }
</style>