<div class="quickInput"><div class="quickInputTable"><span class="quickInputTitleStyle">余额快捷输入 (单位：元)</span><div class="box"><div class="btn1" v-for="num in btnList" @click="balanceEntry(num)">{{ num }}</div></div></div><div class="btn"><el-button type="primary">保存</el-button></div></div>

.box {width: 8.75rem;height: 2.5rem;display: grid;grid-template-columns: repeat(7, 1fr);grid-template-rows: repeat(2, 1fr);justify-items: center;align-items: center;grid-row-gap: 2px;grid-column-gap: 2px;//给整个表格加背景颜色，用于突出gap颜色（灰色）background-color: rgb(222, 222, 222);border: .025rem solid rgb(222, 222, 222);
}.btn1 {cursor: pointer;color: rgb(244, 124, 0);font-weight: bold;//给item添加白色背景色，用于突出gap颜色（灰色）background-color: #fff;width: 100%;height: 100%;//使用flex布局实现居中display: flex;justify-content: center;align-items: center;
}

data() {return {btnList: [100, 200, 300, 500, 600, 800, 1000, 1500, 2000, 3000, 5000, '未设置', '未设置', '未设置'],}},