左右布局（备用复制）

<template>
    <el-dialog title="修改密码" :visible.sync="dialogVisible" width="60%" :before-close="handleClose">
        <div style="font-size: 12px; color: #666">
            <div class="setBox">
                <div class="setBox_d">粉丝昵称</div>
                <div>春花布艺17526695910</div>
            </div>
            <div class="setBox">
                <div class="setBox_d">粉丝openID</div>
                <div>oCILfwZqB6BtroRM5BLMWbaRLk5I</div>
            </div>
            <div class="setBox">
                <div class="setBox_d">粉丝分组</div>
                <div>未分组</div>
            </div>
            <div class="setBox">
                <div class="setBox_d">关注时间</div>
                <div>2020-04-23 20:41:14</div>
            </div>
        </div>
        <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
        </span>
    </el-dialog>
</template>

<script>
export default {
    data() {
        return {
            dialogVisible: false
        };
    },
    methods: {
        show(option) {
            this.dialogVisible = option.dialogVisible;
        },
        handleClose(done) {
            done();
        }
    }
};
</script>

<style scoped>
.setBox {
    display: flex;
    margin-bottom: 40px;
}
.setBox_d {
     120px;
    text-align: right;
    margin-right: 15px;
}
</style>