<template>
    <div style="padding: 0px 10px;">
        <div class="abap-api-item">
            <div>显示</div>
            <div>
                <el-checkbox v-model="form.i.show">整型(I)</el-checkbox>
                <el-checkbox v-model="form.f.show">浮点型(F)</el-checkbox>
                <el-checkbox v-model="form.p.show">包/小数型(P)</el-checkbox>
                <el-checkbox v-model="form.c.show">文本(C)</el-checkbox>
                <el-checkbox v-model="form.n.show">数值(N)</el-checkbox><br>
                <el-checkbox v-model="form.d.show">日期(D)</el-checkbox>
                <el-checkbox v-model="form.t.show">时间(T)</el-checkbox><br>
                <el-checkbox v-model="form.type.show">自定义类型(TYPES)</el-checkbox><br>

            </div>
        </div>

        <div v-show="form.i.show">
            <el-divider content-position="left" class="sap-abap-divider">整型(I)</el-divider>
            <div class="abap-api-item-2">
                <div>变量名</div>
                <div>
                    <el-input v-model="form.i.paramName"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>默认值</div>
                <div>
                    <el-input v-model="form.i.defaultValue" placeholder="默认 0"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>赋值</div>
                <div>
                    <el-input v-model="form.i.value"></el-input>
                </div>
            </div>
        </div>
        <div v-show="form.f.show">
            <el-divider content-position="left" class="sap-abap-divider">浮点型(I)</el-divider>
            <div class="abap-api-item-2">
                <div>变量名</div>
                <div>
                    <el-input v-model="form.f.paramName"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>默认值</div>
                <div>
                    <el-input v-model="form.f.defaultValue" placeholder="默认 0"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>赋值</div>
                <div>
                    <el-input v-model="form.f.value"></el-input>
                </div>
            </div>
        </div>
        <div v-show="form.p.show">
            <el-divider content-position="left" class="sap-abap-divider">包/小数型(P)</el-divider>
            <div class="abap-api-item-2">
                <div>变量名</div>
                <div>
                    <el-input v-model="form.p.paramName"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>默认值</div>
                <div>
                    <el-input v-model="form.p.defaultValue" placeholder="默认 0"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>长度</div>
                <div>
                    <el-input v-model="form.p.length" placeholder="默认 8"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>小数位</div>
                <div>
                    <el-input v-model="form.p.decimalLength" placeholder="默认 0"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>赋值</div>
                <div>
                    <el-input v-model="form.p.value"></el-input>
                </div>
            </div>
        </div>
        <div v-show="form.c.show">
            <el-divider content-position="left" class="sap-abap-divider">文本型(C)</el-divider>
            <div class="abap-api-item-2">
                <div>变量名</div>
                <div>
                    <el-input v-model="form.c.paramName"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>默认值</div>
                <div>
                    <el-input v-model="form.c.defaultValue" placeholder="默认空字符串"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>长度</div>
                <div>
                    <el-input v-model="form.c.length" placeholder="默认 1"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>赋值</div>
                <div>
                    <el-input v-model="form.c.value"></el-input>
                </div>
            </div>
        </div>
        <div v-show="form.n.show">
            <el-divider content-position="left" class="sap-abap-divider">数值型(N)</el-divider>
            <div class="abap-api-item-2">
                <div>变量名</div>
                <div>
                    <el-input v-model="form.n.paramName"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>默认值</div>
                <div>
                    <el-input v-model="form.n.defaultValue" placeholder="默认 '0'"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>长度</div>
                <div>
                    <el-input v-model="form.n.length" placeholder="默认 1"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>赋值</div>
                <div>
                    <el-input v-model="form.n.value"></el-input>
                </div>
            </div>
        </div>
        <div v-show="form.d.show">
            <el-divider content-position="left" class="sap-abap-divider">日期(D)</el-divider>
            <div class="abap-api-item-2">
                <div>变量名</div>
                <div>
                    <el-input v-model="form.d.paramName"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>默认值</div>
                <div>
                    <el-input v-model="form.d.defaultValue" placeholder="默认 '00000000'"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>赋值</div>
                <div>
                    <el-input v-model="form.d.value" placeholder="格式：YYYYMMDD"></el-input>
                </div>
            </div>
        </div>
        <div v-show="form.t.show">
            <el-divider content-position="left" class="sap-abap-divider">时间(T)</el-divider>
            <div class="abap-api-item-2">
                <div>变量名</div>
                <div>
                    <el-input v-model="form.t.paramName"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>默认值</div>
                <div>
                    <el-input v-model="form.t.defaultValue" placeholder="默认 '000000'"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>赋值</div>
                <div>
                    <el-input v-model="form.t.value" placeholder="格式：hhmmss"></el-input>
                </div>
            </div>
        </div>
        <div v-show="form.type.show">
            <el-divider content-position="left" class="sap-abap-divider">时间(T)</el-divider>
            <div class="abap-api-item-2">
                <div>变量名</div>
                <div>
                    <el-input v-model="form.type.paramName"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>默认值</div>
                <div>
                    <el-input v-model="form.type.defaultValue" placeholder="默认 '000000'"></el-input>
                </div>
            </div>
            <div class="abap-api-item-2">
                <div>赋值</div>
                <div>
                    <el-input v-model="form.type.value" placeholder="格式：hhmmss"></el-input>
                </div>
            </div>
        </div>

    </div>
</template>

<script>
import AbapItemBase from './AbapItemBase'

export default {
    name: 'AbapCodeDataDefine',
    extends: AbapItemBase,
    data() {
        return {
            form: {
                i: {
                    show: false,
                    defaultValue: undefined,
                    paramName: "lv_i",
                    value: undefined,
                },
                f: {
                    show: false,
                    defaultValue: undefined,
                    paramName: "lv_f",
                    value: undefined,
                },
                p: {
                    show: false,
                    defaultValue: undefined,
                    paramName: "lv_p",
                    length: undefined,
                    decimalLength: undefined,
                    value: undefined,
                },
                c: {
                    show: false,
                    defaultValue: undefined,
                    paramName: "lv_c",
                    length: undefined,
                    value: undefined,
                },
                n: {
                    show: false,
                    defaultValue: undefined,
                    paramName: "lv_n",
                    length: undefined,
                    value: undefined,
                },
                d: {
                    show: false,
                    defaultValue: undefined,
                    paramName: "lv_d",
                    value: undefined,
                },
                t: {
                    show: false,
                    defaultValue: undefined,
                    paramName: "lv_t",
                    value: undefined,
                },
                type: {
                    show: false,
                    defaultValue: undefined,
                    paramName: "lv_t",
                    value: undefined,
                },
            }
        }
    },
    watch: {
        form: {
            handler: 'initCode',
            deep: true
        }
    },
    created() {
        this.initCode()
    },
    methods: {
        initCode() {
            console.log("重载...");
            let str = "";
            str += this.showI();
            str += this.showF();
            str += this.showP();
            str += this.showC();
            str += this.showN();
            str += this.showD();
            str += this.showT();
            this.abapCode = str;
        },
        showI() {
            let str = "";
            let obj = this.form.i;
            if (!obj.show) {
                return "";
            }

            let defaultValue = obj.defaultValue;
            let value = obj.value == undefined ? '' : obj.value;
            let length = obj.length == undefined ? '' : `(${obj.length})`;
            let paramName = obj.paramName;

            if (defaultValue == undefined || defaultValue == null || defaultValue == '') {
                str += `DATA ${paramName}${length} TYPE I. "整数\n`;
            } else {
                str += `DATA ${paramName}${length} TYPE I VALUE ${defaultValue}. "整数\n`;
            }
            if (obj.value != undefined) {
                str += `${paramName} = ${value}.\n`;
            }
            return str;
        },
        showF() {
            let str = "";
            let obj = this.form.f;
            if (!obj.show) {
                return "";
            }

            let defaultValue = obj.defaultValue;
            let value = obj.value == undefined ? '' : obj.value;
            let length = obj.length == undefined ? '' : `(${obj.length})`;
            let paramName = obj.paramName;

            if (defaultValue == undefined || defaultValue == null || defaultValue == '') {
                str += `DATA ${paramName}${length} TYPE F. "浮点数\n`;
            } else {
                str += `DATA ${paramName}${length} TYPE F VALUE '${defaultValue}'. "浮点数\n`;
            }
            if (obj.value != undefined) {
                str += `${paramName} = '${value}'.\n`;
            }
            return str;
        },
        showP() {
            let str = "";
            let obj = this.form.p;
            if (!obj.show) {
                return "";
            }

            let defaultValue = obj.defaultValue;
            let value = obj.value == undefined ? '' : obj.value;
            let length = obj.length == undefined ? '' : `(${obj.length})`;
            let decimalLength = obj.decimalLength == undefined ? '' : ` DECIMALS ${obj.decimalLength}`;
            let paramName = obj.paramName;

            if (defaultValue == undefined || defaultValue == null || defaultValue == '') {
                str += `DATA ${paramName}${length} TYPE P. "包类型(定点数)\n`;
            } else {
                str += `DATA ${paramName}${length} TYPE P${decimalLength} VALUE '${defaultValue}'. "包类型(定点数)\n`;
            }
            if (obj.value != undefined) {
                str += `${paramName} = '${value}'.\n`;
            }
            return str;
        },
        showC() {
            let str = "";
            let obj = this.form.c;
            if (!obj.show) {
                return "";
            }

            let defaultValue = obj.defaultValue;
            let value = obj.value == undefined ? '' : obj.value;
            let length = obj.length == undefined ? '' : `(${obj.length})`;
            let paramName = obj.paramName;

            if (defaultValue == undefined || defaultValue == null || defaultValue == '') {
                str += `DATA ${paramName}${length} TYPE C. "文本\n`;
            } else {
                str += `DATA ${paramName}${length} TYPE C VALUE '${defaultValue}'. "文本\n`;
            }
            if (obj.value != undefined) {
                str += `${paramName} = '${value}'.\n`;
            }
            return str;
        },
        showN() {
            let str = "";
            let obj = this.form.n;
            if (!obj.show) {
                return "";
            }

            let defaultValue = obj.defaultValue;
            let value = obj.value == undefined ? '' : obj.value;
            let length = obj.length == undefined ? '' : `(${obj.length})`;
            let paramName = obj.paramName;

            if (defaultValue == undefined || defaultValue == null || defaultValue == '') {
                str += `DATA ${paramName}${length} TYPE N. "数值\n`;
            } else {
                str += `DATA ${paramName}${length} TYPE N VALUE '${defaultValue}'. "数值\n`;
            }
            if (obj.value != undefined) {
                str += `${paramName} = '${value}'.\n`;
            }
            return str;
        },
        showD() {
            let str = "";
            let obj = this.form.d;
            if (!obj.show) {
                return "";
            }

            let defaultValue = obj.defaultValue;
            let value = obj.value == undefined ? '' : obj.value;
            let paramName = obj.paramName;

            if (defaultValue == undefined || defaultValue == null || defaultValue == '') {
                str += `DATA ${paramName} TYPE D. "日期\n`;
            } else {
                str += `DATA ${paramName} TYPE D VALUE '${defaultValue}'. "日期\n`;
            }
            if (obj.value != undefined) {
                str += `${paramName} = '${value}'.\n`;
            }
            return str;
        },
        showT() {
            let str = "";
            let obj = this.form.t;
            if (!obj.show) {
                return "";
            }

            let defaultValue = obj.defaultValue;
            let value = obj.value == undefined ? '' : obj.value;
            let paramName = obj.paramName;

            if (defaultValue == undefined || defaultValue == null || defaultValue == '') {
                str += `DATA ${paramName} TYPE T. "时间\n`;
            } else {
                str += `DATA ${paramName} TYPE T VALUE '${defaultValue}'. "时间\n`;
            }
            if (obj.value != undefined) {
                str += `${paramName} = '${value}'.\n`;
            }
            return str;
        }
    }
}
</script>

<style scoped>
</style>
