<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>报价</title> <meta name="author" content="JIAL"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="HandheldFriendly" content="true"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/> <link rel="icon" href="/static/image/JNlogo.png" type="image/x-icon"> <link rel="stylesheet" href="/plugins/element-ui/index.css"> <!-- import CSS --> <link rel="stylesheet" href="/static/zmquotation/css/index.css"> </head> <body> <div class="container" id="index-app"> <div class="center-container"> <div class="form-box"> <el-form label-width="45%" :model="formLabelAlign"> <el-row> <el-col :span="6"> <el-form-item label="加工费" title="蒸汽费/钢丝铠装材料及加工费"> <el-input v-model="formLabelAlign.processingFee" placeholder="蒸汽费/钢丝铠装材料及加工费"> <template slot="append">%</template> </el-input> </el-form-item> </el-col > <el-col :span="6"> <el-form-item label="生产财务成本" title="生产财务成本"> <el-input v-model="formLabelAlign.prodFinancialCost" placeholder="生产财务成本"> <template slot="append">%</template> </el-input> </el-form-item> </el-col> <el-col :span="6"> <el-form-item label="额外账期" title="额外账期"> <el-input v-model="formLabelAlign.accountPeriod" placeholder="账期"> <template slot="append">%</template> </el-input> </el-form-item> </el-col> <el-col :span="6"> <el-form-item label="承兑" title="承兑"> <el-input v-model="formLabelAlign.acceptance" placeholder="承兑"> <template slot="append">%</template> </el-input> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="6"> <el-form-item label="公司管理成本" title="公司管理成本"> <el-input v-model="formLabelAlign.companyMgmtCost" placeholder="公司管理成本"> <template slot="append">%</template> </el-input> </el-form-item> </el-col > <el-col :span="6"> <el-form-item label="中标服务费" title="中标服务费"> <el-input v-model="formLabelAlign.bidServiceFee" placeholder="中标服务费"> <template slot="append">%</template> </el-input> </el-form-item> </el-col> <el-col :span="6"> <el-form-item label="公司净利润" title="公司净利润"> <el-input v-model="formLabelAlign.netProfit" placeholder="公司净利润"> <template slot="append">%</template> </el-input> </el-form-item> </el-col> <el-col :span="6"> <el-form-item label="业务费" title="业务费"> <el-input v-model="formLabelAlign.businessFee" placeholder="业务费"> <template slot="append">%</template> </el-input> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="6"> <el-form-item label="省"> <el-input :disabled="true" v-model="formLabelAlign.province" placeholder="省"></el-input> </el-form-item> </el-col> <el-col :span="6"> <el-form-item label="市"> <el-input :disabled="true" v-model="formLabelAlign.city" placeholder="市"></el-input> </el-form-item> </el-col> <el-col :span="6"> <el-form-item label="区"> <el-input :disabled="true" v-model="formLabelAlign.district" placeholder="区"></el-input> </el-form-item> </el-col> <el-col :span="6" > <el-form-item label="公里数"> <el-input v-model="formLabelAlign.kilometers" placeholder="公里数"> <template slot="append">KM</template> </el-input> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="6"> <el-form-item label="可下浮点数" title="可下浮点数"> <el-input v-model="formLabelAlign.canFloat" placeholder="可下浮"> <template slot="append">%</template> </el-input> </el-form-item> </el-col> <el-col :span="6" > <el-form-item label="运费"> <el-input v-model="formLabelAlign.freight" placeholder="运费"> <template slot="append">¥</template> </el-input> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="6"> <el-form-item label="净重合计" title="净重合计"> <el-input v-model="formLabelAlign.netWeightTotal" placeholder="净重合计"> <template slot="append">KG</template> </el-input> </el-form-item> </el-col > <el-col :span="6"> <el-form-item label="重量合计" title="重量合计"> <el-input v-model="formLabelAlign.weightTotal" placeholder="重量合计"> <template slot="append">KG</template> </el-input> </el-form-item> </el-col> <el-col :span="6" > <el-form-item label="厂价金额合计" title="厂价金额合计"> <el-input v-model="formLabelAlign.totalFactoryAmount" placeholder="厂价金额合计"> <template slot="append">¥</template> </el-input> </el-form-item> </el-col> <el-col :span="6" > <el-form-item label="实际金额合计" title="实际金额合计"> <el-input v-model="formLabelAlign.totalActualAmount" placeholder="实际金额合计"> <template slot="append">¥</template> </el-input> </el-form-item> </el-col> </el-row> </el-form> </div> <div class="button-box"> <el-button type="text" @click="selectedRegion">选择地区</el-button> <el-button type="text">添加物料</el-button> <el-button type="text">刷新界面</el-button> <el-button type="text"></el-button> </div> <div class="table-box"> <el-table :data="tableData" border :cell-style="cellStyle" :header-cell-style="{ background: '#eef1f6', color: '#606266', 'text-align': 'center' }"> <el-table-column fixed label="编号" type="index" width="50"> </el-table-column> <el-table-column fixed width="180" prop="kunnr1" label="品名"> </el-table-column> <el-table-column width="180" prop="kunnr2" label="数量"> <template slot-scope="scope"> <el-input v-model="scope.row.kunnr2" > </el-input> </template> </el-table-column> <el-table-column width="180" prop="kunnr3" label="电压"> </el-table-column> <el-table-column width="180" prop="kunnr4" label="标准"> </el-table-column> <el-table-column width="180" prop="kunnr5" label="纤芯"> </el-table-column> <el-table-column width="180" prop="kunnr6" label="成本价"> </el-table-column> <el-table-column width="180" prop="kunnr7" label="厂价"> </el-table-column> <el-table-column width="180" prop="kunnr8" label="净量"> </el-table-column> <el-table-column width="180" prop="kunnr8" label="盘具"> <template slot-scope="scope"> <el-input v-model="scope.row.kunnr2" > </el-input> </template> </el-table-column> <el-table-column width="180" prop="kunnr8" label="盘重"> </el-table-column> <el-table-column width="180" prop="kunnr8" label="总重"> </el-table-column> <el-table-column fixed="right" width="120" prop="kunnr8" label="总成本"> </el-table-column> <el-table-column fixed="right" width="120" prop="kunnr8" label="总厂价"> </el-table-column> <el-table-column fixed="right" width="120" prop="kunnr8" label="总净重"> </el-table-column> <el-table-column fixed="right" width="80" label="操作"> <template slot-scope="scope"> <el-button @click="handleDeleteClick(scope.row)" style="color: red;" type="text">删除</el-button> </template> </el-table-column> </el-table> </div> </div> <el-dialog title="选择地区" :visible.sync="dialogRegionVisible"> </el-dialog> </div> <script src="/plugins/vue/vue.js"></script> <script src="/plugins/element-ui/index.js"></script> <script src="/plugins/calendar/calendar.js"></script> <script src="/plugins/axios/axios.min.js"></script> <script src="/plugins/axios/request.js"></script> <!-- import Script --> <script src="/static/zmquotation/js/index.js"></script> <script> new Vue({ el: '#index-app', data() { return { formLabelAlign: { processingFee: '0.60', /*蒸汽费/钢丝铠装材料及加工费*/ prodFinancialCost: '0.40', /*生产财务成本*/ accountPeriod: '1.20', /*账期*/ acceptance: '0.90', /*承兑*/ companyMgmtCost: '1.50', /*公司管理成本*/ bidServiceFee: '0.44', /*中标服务费*/ netProfit: '3.00', /*公司净利润*/ businessFee: '2.00', /*业务费*/ province: '', /*省*/ city: '', /*市*/ district: '', /*区*/ freight: '', /*运费*/ canFloat: '', /*可下浮点数*/ kilometers: '', /*公里数*/ netWeightTotal: '', /*净重合计*/ weightTotal: '', /*重量合计*/ totalFactoryAmount: '', /*厂价金额合计*/ totalActualAmount: '', /*实际金额合计*/ }, tableData: [ { kunnr1: '001', kunnr2: '002', kunnr3: '003', kunnr4: '004', kunnr5: '005', kunnr6: '006', kunnr7: '007', kunnr8: '008' }, { kunnr1: '101', kunnr2: '102', kunnr3: '103', kunnr4: '104', kunnr5: '105', kunnr6: '106', kunnr7: '107', kunnr8: '108' }, // Add more rows as needed ], } }, computed: { }, created() { }, mounted() { }, methods: { async init () { }, cellStyle({row, column, rowIndex, columnIndex}) { if(columnIndex === 0) { return 'color : black; text-align : center; background : #E0E0E0; padding: 2px 0px 1px 0px'; } else if (columnIndex === 8) { return 'text-align : center; background : #F5F5F5; padding: 2px 0px 1px 0px'; } else { return ' text-align : center; height : 10px; padding: 2px 0px 1px 0px'; } }, handleDeleteClick(index){ this.tableData.splice(index, 1) }, selectedRegion(){ } }, }) </script> </body> </html>