SetpanDialog.vue

<template>
    <el-dialog
        v-if="visiable"
        :visible.sync="visiable"
        center
        destroy-on-close
        :before-close="beforeClose"
        width="70%"
    >
        <el-form v-model="formData" label-width="150px">
            <c-row>
                <c-col>
                    <c-col :span="12">
                        <el-form-item label="费用代码">
                            <c-input v-model="formData.feecod" disabled />
                        </el-form-item>
                    </c-col>
                    <c-col :span="12">
                        <el-form-item label="中文描述">
                            <c-col :span="13">
                                <c-input v-model="formData.feetxt" />
                            </c-col>
                            <c-col :span="11">
                                <el-form-item label="" label-width="5px">
                                    <c-select
                                        v-model="formData.modflg"
                                        disabled
                                        :code="codes.modflg"
                                    />
                                </el-form-item>
                            </c-col>
                        </el-form-item>
                    </c-col>
                </c-col>
                <c-col :span="24">
                    <c-col :span="6">
                        <el-form-item label="详细信息">
                            <c-input v-model="formData.feetxtinf" />
                        </el-form-item>
                    </c-col>
                    <c-col :span="6">
                        <el-form-item label="起算时间">
                            <!-- <c-input v-model="formData.dat1" type="date" /> -->
                            <c-date-picker
                                type="date"
                                v-model="formData.dat1"
                                format="yyyy-MM-dd"
                                style="width: 100%"
                                placeholder="请选择起算时间"
                            ></c-date-picker>
                        </el-form-item>
                    </c-col>
                    <c-col :span="6">
                        <el-form-item label="结束时间">
                            <c-date-picker
                                type="date"
                                v-model="formData.dat2"
                                format="yyyy-MM-dd"
                                style="width: 100%"
                                placeholder="请选择结束时间"
                            ></c-date-picker>
                        </el-form-item>
                    </c-col>
                    <c-col :span="6">
                        <el-form-item label="收取份数">
                            <c-input v-model="formData.unt" />
                        </el-form-item>
                    </c-col>
                </c-col>
                <c-col :span="24">
                    <c-col :span="12">
                        <el-form-item label="费用换算">
                            <c-col :span="13">
                                <c-select
                                    v-model="formData.usrcur"
                                    style="width: 100%"
                                >
                                    <el-option
                                        v-for="item in codes.cur"
                                        :label="item.label"
                                        :value="item.value"
                                        :key="item.value"
                                    />
                                </c-select>
                            </c-col>
                            <c-col :span="11">
                                <el-form-item label="" label-width="5px">
                                    <c-input v-model="formData.usramt" />
                                </el-form-item>
                            </c-col>
                        </el-form-item>
                    </c-col>
                    <c-col :span="12">
                        <el-form-item label="应收费用">
                            <c-col :span="13">
                                <c-input v-model="formData.cur" disabled />
                            </c-col>
                            <c-col :span="11">
                                <el-form-item label="" label-width="5px">
                                    <c-input
                                        v-model="formData.ogiamt"
                                        disabled
                                    />
                                </el-form-item>
                            </c-col>
                        </el-form-item>
                    </c-col>
                </c-col>
                <c-col :span="24">
                    <c-col :span="12">
                        <el-form-item label="付款方">
                            <c-select v-model="formData.rol" style="width:100%">
                                <el-option
                                    v-for="item in codes.setfelRol"
                                    :label="item.label"
                                    :value="item.value"
                                    :key="item.value"
                                />
                            </c-select>
                        </el-form-item>
                    </c-col>
                    <c-col :span="12">
                        <el-form-item label="计算周期起始">
                            <c-input v-model="formData.datrefbeg" disabled />
                        </el-form-item>
                    </c-col>
                </c-col>
                <c-col :span="24">
                    <c-col :span="12">
                        <c-col :span="12">
                            <el-form-item label="优惠百分比">
                                <c-input v-model="formData.dctrat" @keyup.enter.native="eventFunction('setmod.setfeg.setfel('+ (idx+1) +').dctrat')">
                                    <template #suffix>%</template>
                                </c-input>
                            </el-form-item>
                        </c-col>
                        <c-col :span="12">
                            <el-form-item label="优惠金额">
                                <c-input v-model="formData.dctamt" @keyup.enter.native=$event.target.blur() @blur="eventFunction('setmod.setfeg.setfel('+ (idx+1) +').dctamt')" />
                            </el-form-item>
                        </c-col>
                    </c-col>

                    <c-col :span="12">
                        <el-form-item label="优惠后实收费用金额">
                            <c-input v-model="formData.amt" @keyup.enter.native="eventFunction('setmod.setfeg.setfel('+ (idx+1) +').amt')" />
                        </el-form-item>
                    </c-col>
                </c-col>
                <c-col :span="24">
                    <el-form-item
                        :label="
                            idx == 1
                                ? 'Per mile fee depending on duration'
                                : 'A fixed amount per unit is caculated. This type will, for example, be used for correspondence charges.'
                        "
                        label-width="700px"
                    />
                </c-col>
                <c-col :span="12">
                    <c-col v-if="idx == 1">
                        <c-col>
                            <el-form-item label="千分率">
                                <c-input v-model="formData.wrkfec.ratcal" />
                            </el-form-item>
                        </c-col>
                        <c-col>
                            <el-form-item label="最小值">
                                <c-col :span="13">
                                    <c-select
                                        v-model="formData.wrkfec.mincur"
                                        style="width: 100%"
                                    >
                                        <el-option
                                            v-for="item in codes.cur"
                                            :label="item.label"
                                            :value="item.value"
                                            :key="item.value"
                                        />
                                    </c-select>
                                </c-col>
                                <c-col :span="11">
                                    <el-form-item label="" label-width="5px">
                                        <c-input
                                            v-model="formData.wrkfec.minamt"
                                        />
                                    </el-form-item>
                                </c-col>
                            </el-form-item>
                        </c-col>
                        <c-col>
                            <el-form-item label="最大值">
                                <c-col :span="13">
                                    <c-select
                                        v-model="formData.wrkfec.maxcur"
                                        style="width: 100%"
                                    >
                                        <el-option
                                            v-for="item in codes.cur"
                                            :label="item.label"
                                            :value="item.value"
                                            :key="item.value"
                                        />
                                    </c-select>
                                </c-col>
                                <c-col :span="11">
                                    <el-form-item label="" label-width="5px">
                                        <c-input
                                            v-model="formData.wrkfec.maxamt"
                                        />
                                    </el-form-item>
                                </c-col>
                            </el-form-item>
                        </c-col>
                        <c-col>
                            <el-form-item>
                                <c-checkbox
                                    label="每个计费区间与最大值/最小值比较"
                                    v-model="formData.fecp1.jnwshx"
                                />
                            </el-form-item>
                        </c-col>
                    </c-col>
                    <c-col v-else>
                        <el-form-item label="Amount">
                            <c-col :span="13">
                                <c-select v-model="formData.wrkfec.ratcur">
                                    <el-option
                                        v-for="item in codes.cur"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value"
                                    >
                                    </el-option>
                                </c-select>
                            </c-col>
                            <c-col :span="11">
                                <el-form-item label="" label-width="5px">
                                    <c-input v-model="formData.wrkfec.untamt">
                                    </c-input>
                                </el-form-item>
                            </c-col>
                        </el-form-item>
                    </c-col>
                    <c-col>
                        <el-form-item label="销项税">
                            <c-input v-model="formData.fecp1.taxrat" disabled />
                        </el-form-item>
                    </c-col>
                    <c-col>
                        <el-form-item label="客户属性">
                            <c-input v-model="formData.fecp1.custyp" disabled />
                        </el-form-item>
                    </c-col>


                    <c-col >
                    <el-form-item label="收费的说明信息">
                        <c-input
                            v-model="formData.inftxt"
                            disabled
                            rows="10"
                            type="textarea"
                            
                        />
                    </el-form-item>
                    </c-col>

                </c-col>
                <c-col v-if="idx == 1" :span="12">
                    <el-form-item label="计费基础金额">
                        <c-input v-model="formData.wrkfec.calcbs" disabled />
                    </el-form-item>
                    <br />
                    <el-form-item label="计费周期">
                        <c-select v-model="formData.wrkfec.pertyp" @change="defaultFunction()">
                            <el-option
                                v-for="item in codes.pertyp"
                                :label="item.label"
                                :value="item.value"
                                :key="item.value"
                            />
                        </c-select>
                    </el-form-item>
                    <br />
                    <el-form-item label="最小周期">
                        <c-input v-model="formData.wrkfec.permin" />
                    </el-form-item>
                    <br />
                    <el-form-item label="周期阶梯费率" />
                    <br />
                    <el-form-item label="周期">
                        <c-col :span="12">
                            <c-input v-model="formData.wrkfec.perbegtr2" />
                        </c-col>
                        <c-col :span="11" :offset="1">
                            <c-input v-model="formData.wrkfec.perrattr2" />
                        </c-col>
                    </el-form-item>
                    <el-form-item label="周期">
                        <c-col :span="12">
                            <c-input v-model="formData.wrkfec.perbegtr3" />
                        </c-col>
                        <c-col :span="11" :offset="1">
                            <c-input
                                disabled
                                v-model="formData.wrkfec.perrattr3"
                            />
                        </c-col>
                    </el-form-item>
                    <el-form-item label="周期">
                        <c-col :span="12">
                            <c-input
                                disabled
                                v-model="formData.wrkfec.perbegtr4"
                            />
                        </c-col>
                        <c-col :span="11" :offset="1">
                            <c-input
                                disabled
                                v-model="formData.wrkfec.perrattr4"
                            />
                        </c-col>
                    </el-form-item>
                    <el-form-item label="周期">
                        <c-col :span="12">
                            <c-input
                                disabled
                                v-model="formData.wrkfec.perbegtr5"
                            />
                        </c-col>
                        <c-col :span="11" :offset="1">
                            <c-input
                                disabled
                                v-model="formData.wrkfec.perrattr5"
                            />
                        </c-col>
                    </el-form-item>
                </c-col>
                <c-col>&nbsp;</c-col>
                

                <c-col :span="4" :offset="9">
                    <c-button type="primary" @click="saveDialog">
                        确 定
                    </c-button>
                </c-col>
                <c-col :span="6">
                    <c-button @click="visiable = false">取 消</c-button>
                </c-col>
                <c-col>&nbsp;</c-col>
            </c-row>
        </el-form>
    </el-dialog>
</template>

<script>
import commonProcess from "~/mixin/commonProcess";

export default {
    inject: ['root'],
    mixins: [commonProcess],
    props: {
        model: Object,
        idx: Number,
        codes: Object,
    },
    data() {
        return {
            visiable: false,
        };
    },
    computed: {
        formData() {
            return this.model.setmod.setfeg.setfel[this.idx]
        }
    },
    methods: {
        saveDialog() {
            this.model.setmod.setfeg.setfel.splice(this.idx, 1, this.formData);
            this.$nextTick(()=>{
            this.executeRule("setmod.glemod.glepan").then((res) => {
            //TODO 处理数据逻辑
              if (res.respCode == SUCCESS) this.updateModel(res.data)
              })
            })
            this.visiable = false;
        },
        beforeClose(done) {
            this.visiable = false;
            done();
        },
    },
};
</script>
<style>
.el-col>.el-col {
    /* padding-right: 10px!important; */
}
</style>