|
|
<template> <div class="mod-config"> <el-form :inline="true" label-position="top" :model="searchData" @keyup.enter.native="getDataList()"> <el-form-item :label="'工厂编码'"> <el-input v-model="searchData.site" style="width: 120px"></el-input> </el-form-item> <el-form-item :label="'供应商编码'"> <el-input v-model="searchData.supplierID" style="width: 120px"></el-input> </el-form-item> <el-form-item :label="'供应商名称'"> <el-input v-model="searchData.supplierName" style="width: 120px"></el-input> </el-form-item> <el-form-item :label="'在用'"> <el-select filterable v-model="searchData.active" style="width: 130px"> <el-option label="全部" value=""></el-option> <el-option label="是" value="Y"></el-option> <el-option label="否" value="N"></el-option> </el-select> </el-form-item> <el-form-item :label="' '"> <el-button @click="getDataList()">查询</el-button> <el-button type="primary" @click="addModal()">新增</el-button> <!-- <el-button type="danger" @click="deleteSupplier()" :disabled="dataListSelections.length <= 0">批量删除</el-button>--> </el-form-item> </el-form> <el-table :height="height" :data="dataList" border v-loading="dataListLoading"
style="width: 100%;"> <!-- <el-table-column--> <!-- type="selection"--> <!-- header-align="center"--> <!-- align="center"--> <!-- width="50">--> <!-- </el-table-column>--> <el-table-column v-for="(item,index) in columnList" :key="index" :sortable="item.columnSortable" :prop="item.columnProp" :header-align="item.headerAlign" :show-overflow-tooltip="item.showOverflowTooltip" :align="item.align" :fixed="item.fixed==''?false:item.fixed" :min-width="item.columnWidth" :label="item.columnLabel"> <template slot-scope="scope"> <span v-if="!item.columnHidden"> {{ scope.row[item.columnProp] }}</span> <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span> </template> </el-table-column> <el-table-column fixed="right" header-align="center" align="center" width="100" label="操作"> <template slot-scope="scope"> <a type="text" size="small" @click="updateModal(scope.row)">修改</a> <a type="text" size="small" @click="deleteSupplier(scope.row)">删除</a> </template> </el-table-column> </el-table> <el-pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="pageIndex" :page-sizes="[20, 50, 100, 1000]" :page-size="pageSize" :total="totalPage" layout="total, sizes, prev, pager, next, jumper"> </el-pagination> <el-dialog title="供应商" :close-on-click-modal="false" v-drag :visible.sync="modalFlag" width="430px"> <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: -5px;"> <el-form-item label="供应商编码:"> <el-input v-model="modalData.supplierID" :disabled="modalDisableFlag" style="width: 120px"></el-input> </el-form-item> <el-form-item label="供应商名称:"> <el-input v-model="modalData.supplierName" style="width: 120px"></el-input> </el-form-item> <el-form-item label="是否在用:"> <el-select filterable v-model="modalData.active" style="width: 120px"> <el-option label="是" value="Y"></el-option> <el-option label="否" value="N"></el-option> </el-select> </el-form-item> </el-form> <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: 0px;"> <el-form-item label="联系人:"> <el-input v-model="modalData.contact" style="width: 120px"></el-input> </el-form-item> <el-form-item label="电话:"> <el-input v-model="modalData.phone" style="width: 120px"></el-input> </el-form-item> <el-form-item label="邮箱:"> <el-input v-model="modalData.email" style="width: 120px"></el-input> </el-form-item> </el-form> <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: 0px;"> <el-form-item label="地址:"> <el-input v-model="modalData.address" style="width: 375px"></el-input> </el-form-item> </el-form> <el-form :inline="true" label-position="top" style="margin-left: 7px;margin-top: 0px;"> <el-form-item label="备注:"> <el-input v-model="modalData.remark" style="width: 375px"></el-input> </el-form-item> </el-form> <el-footer style="height:40px;margin-top: 10px;text-align:center"> <el-button type="primary" @click="saveData()">保存</el-button> <el-button type="primary" @click="modalFlag = false">关闭</el-button> </el-footer> </el-dialog> </div></template>
<script> import { eamSupplierSearch, eamSupplierSave, eamSupplierEdit, eamSupplierDelete, } from "@/api/eam/eam.js" export default {
data () { return {
searchData: { site: this.$store.state.user.site, supplierID: '', supplierName: '', active: 'Y', page: 1, limit: 10, }, height: 200, pageIndex: 1, pageSize: 100, totalPage: 0,
dataList: [], dataListLoading: false, dataListSelections: [], modalFlag:false, modalDisableFlag:false, modalData:{ flag:'', site: this.$store.state.user.site, supplierID:'', supplierName:'', active:'', contact:'', phone:'', address:'', email:'', remark:'', }, departmentList:[], // 展示列集
columnList: [ { userId: this.$store.state.user.name, functionId: 101005, serialNumber: '101005TableSite', tableId: "101005Table", tableName: "common", columnProp: 'site', headerAlign: "center", align: "left", columnLabel: '工厂编码', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 80, }, { userId: this.$store.state.user.name, functionId: 101005, serialNumber: '101005TableSupplierID', tableId: "101005Table", tableName: "common", columnProp: 'supplierID', headerAlign: "center", align: "left", columnLabel: '供应商编码', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 120, }, { userId: this.$store.state.user.name, functionId: 101005, serialNumber: '101005TableSupplierName', tableId: "101005Table", tableName: "common", columnProp: 'supplierName', headerAlign: "center", align: "left", columnLabel: '供应商名称', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 140, }, { userId: this.$store.state.user.name, functionId: 101005, serialNumber: '101005TableActive', tableId: "101005Table", tableName: "common", columnProp: 'active', headerAlign: "center", align: "left", columnLabel: '在用', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 40, }, { userId: this.$store.state.user.name, functionId: 101005, serialNumber: '101005TableContact', tableId: "101005Table", tableName: "common", columnProp: 'contact', headerAlign: "center", align: "left", columnLabel: '联系人', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 60, }, { userId: this.$store.state.user.name, functionId: 101005, serialNumber: '101005TablePhone', tableId: "101005Table", tableName: "common", columnProp: 'phone', headerAlign: "center", align: "left", columnLabel: '电话', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, }, { userId: this.$store.state.user.name, functionId: 101005, serialNumber: '101005TableAddress', tableId: "101005Table", tableName: "common", columnProp: 'address', headerAlign: "center", align: "left", columnLabel: '地址', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 250, }, { userId: this.$store.state.user.name, functionId: 101005, serialNumber: '101005TableEmail', tableId: "101005Table", tableName: "common", columnProp: 'email', headerAlign: "center", align: "left", columnLabel: '邮箱', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 100, }, { userId: this.$store.state.user.name, functionId: 101005, serialNumber: '101005TableRemark', tableId: "101005Table", tableName: "common", columnProp: 'remark', headerAlign: "center", align: "left", columnLabel: '备注', columnHidden: false, columnImage: false, columnSortable: false, sortLv: 0, status: true, fixed: '', columnWidth: 150, }, ], levelList:[],
} }, mounted () { this.$nextTick(() => { this.height = window.innerHeight - 210 }) }, created () { this.getDataList() }, methods: { // 获取数据列表
getDataList () { this.searchData.limit = this.pageSize this.searchData.page = this.pageIndex eamSupplierSearch(this.searchData).then(({data}) => { if (data.code == 0) { this.dataList = data.page.list this.pageIndex = data.page.currPage this.pageSize = data.page.pageSize this.totalPage = data.page.totalCount } this.dataListLoading = false }) }, // 每页数
sizeChangeHandle (val) { this.pageSize = val this.pageIndex = 1 this.getDataList() }, // 当前页
currentChangeHandle (val) { this.pageIndex = val this.getDataList() }, // 多选
selectionChangeHandle (val) { this.dataListSelections = val }, addModal(){ this.modalData={ flag:'1', site: this.$store.state.user.site, supplierID:'', supplierName:'', active:'', contact:'', phone:'', address:'', email:'', remark:'', }; this.modalDisableFlag=false; this.modalFlag=true; }, updateModal(row){ this.modalData={ flag:'2', site: row.site, supplierID:row.supplierID, supplierName:row.supplierName, active:row.active, contact:row.contact, phone:row.phone, address:row.address, email:row.email, remark:row.remark, }; this.modalDisableFlag=true; this.modalFlag=true; }, // 删除
deleteSupplier (row) { this.$confirm(`是否删除这个供应商?`, '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning'
}).then(() => { eamSupplierDelete(row).then(({data}) => { if (data && data.code === '0') { this.getDataList() this.$message({ message: '操作成功', type: 'success', duration: 1500, onClose: () => { } }) } else { this.$alert(data.msg, '错误', { confirmButtonText: '确定' }) } }) }).catch(() => { }) }, saveData(){ if (this.modalData.supplierID == '' || this.modalData.supplierID == null) { this.$alert('请输入供应商编码!', '错误', { confirmButtonText: '确定' }) return false } if (this.modalData.supplierName == '' || this.modalData.supplierName == null) { this.$alert('请输入供应商名称!', '错误', { confirmButtonText: '确定' }) return false } if (this.modalData.active == '' || this.modalData.active == null) { this.$alert('选择是否在用!', '错误', { confirmButtonText: '确定' }) return false } if(this.modalData.flag=='1'){ eamSupplierSave(this.modalData).then(({data}) => { if (data && data.code === '0') { this.getDataList() this.modalFlag=false this.$message({ message: '操作成功', type: 'success', duration: 1500, onClose: () => { } }) } else { this.$alert(data.msg, '错误', { confirmButtonText: '确定' }) } }) }else { eamSupplierEdit(this.modalData).then(({data}) => { if (data && data.code === '0') { this.getDataList() this.modalFlag=false this.$message({ message: '操作成功', type: 'success', duration: 1500, onClose: () => { } }) } else { this.$alert(data.msg, '错误', { confirmButtonText: '确定' }) } }) } }, } }</script>
|