<template> <div class="app-container"> <!--工具栏--> <div class="head-container"> <!--如果想在工具栏加入更多按钮,可以使用插槽方式, slot = 'left' or 'right'--> <crudOperation :permission="permission" /> <!--表单组件--> <el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="500px"> <el-form ref="form" :model="form" :rules="rules" size="mini" label-width="80px"> <el-form-item label="源载具编码"> <el-input v-model="form.origin_vehicle_code" style="width: 370px;" /> </el-form-item> <el-form-item label="源载具类型"> <el-input v-model="form.origin_vehicle_type" style="width: 370px;" /> </el-form-item> <el-form-item label="目标载具编码"> <el-input v-model="form.target_vehicle_code" style="width: 370px;" /> </el-form-item> <el-form-item label="目标载具类型"> <el-input v-model="form.target_vehicle_type" style="width: 370px;" /> </el-form-item> <el-form-item label="源当前物料数量"> <el-input v-model="form.origin_qty" style="width: 370px;" /> </el-form-item> <el-form-item label="目标当前物料数量"> <el-input v-model="form.target_qty" style="width: 370px;" /> </el-form-item> <el-form-item label="取货点"> <el-input v-model="form.get_station" style="width: 370px;" /> </el-form-item> <el-form-item label="放货点"> <el-input v-model="form.put_station" style="width: 370px;" /> </el-form-item> <el-form-item label="工单号"> <el-input v-model="form.order_code" style="width: 370px;" /> </el-form-item> <el-form-item label="记录时间"> <el-input v-model="form.record_time" style="width: 370px;" /> </el-form-item> </el-form> <div slot="footer" class="dialog-footer"> <el-button type="text" @click="crud.cancelCU">取消</el-button> <el-button :loading="crud.cu === 2" type="primary" @click="crud.submitCU">确认</el-button> </div> </el-dialog> <!--表格渲染--> <el-table ref="table" v-loading="crud.loading" :data="crud.data" size="mini" style="width: 100%;" @selection-change="crud.selectionChangeHandler"> <el-table-column type="selection" width="55" /> <el-table-column prop="origin_vehicle_code" label="源载具编码" :min-width="flexWidth('origin_vehicle_code',crud.data,'源载具编码')"/> <el-table-column prop="origin_vehicle_type" label="源载具类型" :min-width="flexWidth('origin_vehicle_type',crud.data,'源载具类型')"/> <el-table-column prop="target_vehicle_code" label="目标载具编码" :min-width="flexWidth('target_vehicle_code',crud.data,'目标载具编码')"/> <el-table-column prop="target_vehicle_type" label="目标载具类型" :min-width="flexWidth('target_vehicle_type',crud.data,'目标载具类型')"/> <el-table-column prop="origin_qty" label="源当前物料数量" :min-width="flexWidth('origin_qty',crud.data,'源当前物料数量')"/> <el-table-column prop="target_qty" label="目标当前物料数量" :min-width="flexWidth('target_qty',crud.data,'目标当前物料数量')"/> <el-table-column prop="get_station" label="取货点" :min-width="flexWidth('get_station',crud.data,'取货点')"/> <el-table-column prop="put_station" label="放货点" :min-width="flexWidth('put_station',crud.data,'放货点')"/> <el-table-column prop="order_code" label="工单号" :min-width="flexWidth('order_code',crud.data,'工单号')"/> <el-table-column prop="record_time" label="记录时间" :min-width="flexWidth('record_time',crud.data,'记录时间')"/> <el-table-column v-permission="[]" label="操作" width="120px" align="center" fixed="right"> <template slot-scope="scope"> <udOperation :data="scope.row" :permission="permission" /> </template> </el-table-column> </el-table> <!--分页组件--> <pagination /> </div> </div> </template> <script> import crudPdmBdVehicleBinding from './pdmBdVehicleBinding' import CRUD, {crud, form, header, presenter} from '@crud/crud' import rrOperation from '@crud/RR.operation' import crudOperation from '@crud/CRUD.operation' import udOperation from '@crud/UD.operation' import pagination from '@crud/Pagination' const defaultForm = { associate_id: null, origin_vehicle_code: null, origin_vehicle_type: null, target_vehicle_code: null, target_vehicle_type: null, origin_qty: null, target_qty: null, get_station: null, put_station: null, order_code: null, record_time: null } export default { name: 'PdmBdVehicleBinding', components: { pagination, crudOperation, rrOperation, udOperation }, mixins: [presenter(), header(), form(defaultForm), crud()], cruds() { return CRUD({ title: '分拣载具关联记录', url: 'api/pdmBdVehicleBinding', idField: 'associate_id', sort: 'associate_id,desc', crudMethod: { ...crudPdmBdVehicleBinding } }) }, data() { return { permission: { }, rules: { } } }, methods: { // 钩子:在获取表格数据之前执行,false 则代表不获取数据 [CRUD.HOOK.beforeRefresh]() { return true } } } </script> <style scoped> </style>