plC.vue 6.24 KB
<template>
    <div>
        <el-dialog v-dialogDrag :close-on-click-modal="false" title="批量层" :visible.sync="isVisible" width="50%"
            @close="close" :modal-append-to-body="false">
            <div>
                <table border="1">
                    <tr>
                        <td class="tdright">层建筑面积(㎡)</td>
                        <td>
                            <el-input v-model="qlcData.cjzmj"
                                oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null"></el-input>
                        </td>
                        <td class="tdright">
                            层套内建筑面积(㎡)
                        </td>
                        <td>
                            <el-input v-model="qlcData.ctnjzmj"
                                oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null"></el-input>
                        </td>
                    </tr>
                    <tr>
                        <td class="tdright">层阳台面积(㎡)</td>
                        <td>
                            <el-input v-model="qlcData.cytmj" class=""
                                oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null"></el-input>
                        </td>
                        <td class="tdright">
                            层半墙面积(㎡)
                        </td>
                        <td>
                            <el-input v-model="qlcData.cbqmj" class=""
                                oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null"></el-input>
                        </td>
                    </tr>
                    <tr>
                        <td class="tdright">层共有建筑面积(㎡)</td>
                        <td>
                            <el-input v-model="qlcData.cgyjzmj" class=""
                                oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null"></el-input>
                        </td>
                        <td class="tdright">
                            层分摊建筑面积(㎡)
                        </td>
                        <td>
                            <el-input v-model="qlcData.cftjzmj" class=""
                                oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null"
                                placeholder="层分摊建筑面积(㎡)"></el-input>
                        </td>
                    </tr>
                    <tr>
                        <td class="tdright">层高(m)</td>
                        <td>
                            <el-input v-model="qlcData.cg" class=""
                                oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="层高(m)">
                            </el-input>
                        </td>
                        <td class="tdright">
                            水平投影面积(㎡)
                        </td>
                        <td>
                            <el-input v-model="qlcData.sptymj" class=""
                                oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="水平投影面积(㎡)">
                            </el-input>
                        </td>
                    </tr>
                </table>
            </div>
            <div class="shop">
                <el-button type="primary" @click="save">保存</el-button>
                <el-button type="primary" @click="result" icon="el-icon-refresh">重置</el-button>
                <el-button type="primary" @click="cancel">取消</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
// import { updatePlc } from '@api/zrz'
export default {
    name: "plC",
    data () {
        return {
            isVisible: false,
            qlcData: {
                cbqmj: '',           // 层半墙面积
                cftjzmj: '',         // 层分摊建筑面积
                cg: '',              // 层高
                cgyjzmj: '',         // 层共有建筑面积
                cjzmj: '',           // 层建筑面积
                ctnjzmj: '',         // 层套内建筑面积
                cytmj: '',           // 层阳台面积
                sptymj: ''           // 水平投影面积
            }
        }
    },
    props: {
        bsms: {
            type: Array,
        },
        plcVisible: {
            type: Boolean,
            default: function () {
                return false
            }
        }
    },
    methods: {
        lodding: function () {
            this.$emit('lodding')
        },
        save: function () {
            this.qlcData['bsms'] = this.bsms
            // updatePlc(this.qlcData).then(res => {
            //     if (res.success) {
            //         Message.success("保存成功")
            //         this.lodding()
            //         this.close()
            //     } else {
            //         Message.error(res.message)
            //     }
            // })
        },
        close: function () {
            this.$emit('close')
            this.isVisible = false
            this.result()
        },
        cancel: function () {
            this.$emit('close')
            this.isVisible = false
        },
        result: function () {
            this.qlcData = {
                cbqmj: '',           // 层半墙面积
                cftjzmj: '',         // 层分摊建筑面积
                cg: '',              // 层高
                cgyjzmj: '',         // 层共有建筑面积
                cjzmj: '',           // 层建筑面积
                ctnjzmj: '',         // 层套内建筑面积
                cytmj: '',           // 层阳台面积
                sptymj: ''           // 水平投影面积
            }
        }
    },
    watch: {
        plcVisible (val) {
            this.isVisible = val
        }
    }
}
</script>

<style scoped>
table {
    margin-top: 10px;
    background-color: #fff;
    font-size: 14px;
    width: 100%;
}

td {
    text-align: center;
    height: 36px;
    min-width: 50px;
}

table:hover {
    cursor: pointer;
}

.inputtitle {
    line-height: 41px;
    width: 95%;
    border: none;
    height: 98%;
    outline: none;
}


.shop {
    margin-top: 20px;
    text-align: center;
}
</style>