• elemenui数据表格加入计数器和输入框


        <!-- 添加药用处方和检查出方的弹出层开始 -->
        <el-dialog  :title="title" :visible.sync="openAddOrderItem" width="1000px" center :close-on-click-modal="false" append-to-body >
    //头部信息可忽略
          <div style="margin:3px;text-align:right">         【{{ submitCareOrder.careOrder.coType==='0'?'药用':'检查' }}】处方总额:¥<span style="color:red">{{ submitCareOrder.careOrder.allAmount }}</span>         <el-button style="margin-left:15px" type="success" icon="el-icon-plus" :disabled="submitCareOrder.careOrderItems.length===0" @click="handleSaveOrderItem">确定添加</el-button>       </div>
    //表格开始
          <el-table border :data="submitCareOrder.careOrderItems" :row-class-name="tableRowClassName">         <el-table-column label="序号" align="center" type="index" width="50" /> //开启序号         <el-table-column :label="submitCareOrder.careOrder.coType==='0'?'药品名称':'项目名称'" align="center" prop="itemName" />         <el-table-column label="数量" width="180px" align="center" prop="num">           <template slot-scope="scope"> //加入计数器             <el-input-number               v-model="scope.row.num"               size="small"               @change="handleCareOrderItemNumChange(scope.row)"             />           </template>         </el-table-column>         <el-table-column label="单价(元)" align="center" prop="price" />         <el-table-column label="金额(元)" align="center" prop="amount" />         <el-table-column label="备注" align="center" prop="remark"> //加入输入框           <template slot-scope="scope">             <el-input               v-model="scope.row.remark"               size="small"             />           </template>         </el-table-column>         <el-table-column label="操作" align="center">           <template slot-scope="scope">             <el-button type="text" icon="el-icon-delete" size="mini" @click="handleCareOrderItemDelete(scope.row)">删除</el-button>           </template>         </el-table-column>       </el-table>       <el-button type="primary" size="mini" style="100%;margin-top:2px" @click="handleOpenAddOrderItemDrawer">添加【{{ submitCareOrder.careOrder.coType==='0'?'药品':'检查' }}】项 </el-button>     </el-dialog>     <!-- 添加药用处方和检查处方的弹出层结束 -->
    data数据----------------

     // 最后要提交到的处方及详情
          submitCareOrder: {
            careOrder: {
              allAmount: 0.00,
              patientId: undefined,
              patientName: undefined,
              coType: '0' // 默认为药用处方
            },
            careOrderItems: []
          },

    方法-----------------
    赋值给careOrderItems大概为[
                 {
                itemName:'分洛1',              
                 num:1,
                  price:5,
                   amount:'50',
                    remerk:'不能出',
                  },{
                itemName:'分洛1',              
                 num:1,
                  price:5,
                   amount:'50',
                    remerk:'不能出',
    
    }
    
    
    

      

    ]
  • 相关阅读:
    ye间模式
    Xutilt网络获取数据
    JUnit
    IntelliJ IDEA快捷键
    Map存放不同数据或对象
    SQL改
    外键约束
    Hibernate之SQL语言查询
    Hibernate之Criteria语言查询
    Hibernate之HQL语言查询
  • 原文地址:https://www.cnblogs.com/javakangkang/p/14002789.html
Copyright © 2020-2023  润新知