Byd_Dg_Web/src/views/business-data/gdDetail/index.vue

113 lines
4.7 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="app-container">
<!--工具栏-->
<div class="head-container">
<div v-if="crud.props.searchToggle">
<!-- -->
<label class="el-form-item-label">关联物料</label>
<el-input v-model="query.itemId" clearable placeholder="关联物料" style="width: 185px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
<rrOperation :crud="crud" />
</div>
<!--如果想在工具栏加入更多按钮,可以使用插槽方式, slot = 'left' or 'right'-->
<crudOperation :permission="permission" :tableKey="this.$options.name"/>
<!--表单组件-->
<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="small" label-width="80px">
<el-form-item label="行号">
<el-input v-model="form.lineNo" style="width: 370px;" />
</el-form-item>
<el-form-item label="关联物料">
未设置字典,请手动设置 Select
</el-form-item>
<el-form-item label="订单数量">
<el-input v-model="form.itemQty" style="width: 370px;" />
</el-form-item>
<el-form-item label="总成代码">
<el-input v-model="form.bigItemId" style="width: 370px;" />
</el-form-item>
<el-form-item label="总成套数">
<el-input v-model="form.bigItemQty" style="width: 370px;" />
</el-form-item>
<el-form-item label="单据类型">
<el-input v-model="form.orderType" 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.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
</div>
</el-dialog>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" size="small" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table-column type="selection" width="55" />
<el-table-column prop="id" label="ID" />
<el-table-column prop="createBy" label="创建人" />
<el-table-column prop="updateBy" label="修改人" />
<el-table-column prop="createTime" label="创建时间" />
<el-table-column prop="updateTime" label="修改时间" />
<el-table-column prop="gd.name" label="任务编号" />
<el-table-column prop="lineNo" label="行号" />
<el-table-column prop="item.code" label="关联物料" />
<el-table-column prop="itemQty" label="单品数量" />
<el-table-column prop="orderQty" label="未拆分数量" />
<el-table-column prop="bigItem.code" label="总成代码" />
<el-table-column prop="bigItemQty" label="总成套数" />
<el-table-column prop="orderType" label="单据类型" />
<el-table-column v-if="checkPer(['admin','gdDetail:edit','gdDetail:del'])" :show-overflow-tooltip="false" fixed="right" label="操作" width="150px" align="center">
<template slot-scope="scope">
<udOperation
:data="scope.row"
:permission="permission"
/>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<pagination />
</div>
</div>
</template>
<script>
import crudGdDetail from '@/api/gdDetail'
import CRUD, { presenter, header, form, crud } 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 = { id: null, createBy: null, updateBy: null, createTime: null, updateTime: null, lineNo: null, item: null, itemQty: null, bigItem: null, bigItemQty: null, orderType: null, gd: null }
export default {
name: 'GdDetail',
components: { pagination, crudOperation, rrOperation, udOperation },
mixins: [presenter(), header(), form(defaultForm), crud()],
cruds() {
return CRUD({ title: 'gdDetail', url: 'api/gdDetail', idField: 'id', sort: 'id,desc', crudMethod: { ...crudGdDetail }})
},
data() {
return {
permission: {
add: ['admin', 'gdDetail:add'],
edit: ['admin', 'gdDetail:edit'],
del: ['admin', 'gdDetail:del']
},
rules: {
},
queryTypeOptions: [
{ key: 'itemId', display_name: '关联物料' }
]
}
},
methods: {
// 钩子在获取表格数据之前执行false 则代表不获取数据
[CRUD.HOOK.beforeRefresh]() {
return true
}
}
}
</script>
<style scoped>
</style>