优化多店门店端添加桌号操作

小郑的碎碎念

于 2024-09-29 15:24:02 发布

阅读量58

点赞数

文章标签： javascript 前端 html

本文链接：https://blog.csdn.net/weixin_52675595/article/details/142636462

版权

问题描述：

防止添加桌号漏掉最后一个。在这里插入图片描述
解决方法：

src/pages/setting/tableCode/list.vue，找到这个文件，对照修改下面代码。

    <FormItem label="桌号：">
      <div>
        <Tag
          v-for="(item, index) in formValidate.number"
          :key="index"
          class="tag"
          size="large"
          >{{ item }}</Tag
        >
        <div class="number-wrap">
          <InputNumber
            v-model="number"
            :min="1"
            :precision="0"
            class="input"
          ></InputNumber>
          <Button type="primary" class="btn" @click="addNumber"
            >添加</Button
          >
        </div>
      </div>
      <div style="font-size: 12px; color: #999999">
        输入桌号后，请点击“添加”按钮确认
      </div>
    </FormItem>

Copy
.number-wrap {
position: relative;
display: inline-flex;
margin: 0 10px 10px 0;
vertical-align: middle;
.ivu-input-number {
border-width: 1px 0 1px 1px;
border-radius: 4px 0 0 4px;
}
.ivu-btn {
padding: 0 10px;
border-radius: 0 4px 4px 0;
}
}