You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

235 lines
7.4 KiB

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="divBox">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item label="客户代码">
<el-input v-model="dataForm.custCode" placeholder="请输入客户代码" clearable></el-input>
</el-form-item>
<el-form-item label="客户名称">
<el-input v-model="dataForm.custName" placeholder="请输入客户名称" clearable></el-input>
</el-form-item>
<el-form-item label="营业执照号码">
<el-input v-model="dataForm.licenseNumber" placeholder="请输入营业执照号码" clearable></el-input>
</el-form-item>
<el-form-item label="联系方式">
<el-input v-model="dataForm.contactWay" placeholder="请输入联系方式" clearable></el-input>
</el-form-item>
<el-form-item label="状态">
<el-input v-model="dataForm.status" placeholder="请输入状态" clearable></el-input>
</el-form-item>
<el-form-item label="联系人">
<el-input v-model="dataForm.contactPerson" placeholder="请输入联系人" clearable></el-input>
</el-form-item>
<el-form-item label="备注">
<el-input v-model="dataForm.remark" placeholder="请输入备注" clearable></el-input>
</el-form-item>
<el-form-item>
<el-button @click="getDataList()">查询</el-button>
<el-button @click="resetForm()">重置</el-button>
<el-button v-hasPermi="['autogencode:cmcust:save']" type="primary" @click="addOrUpdateHandle()">新增数据</el-button>
<el-button v-hasPermi="['autogencode:cmcust:delete']" type="danger" @click="deleteHandle()" :disabled="dataListSelections.length <= 0">批量删除</el-button>
</el-form-item>
</el-form>
<el-table
:data="dataList"
border
v-loading="dataListLoading"
@selection-change="selectionChangeHandle"
style="width: 100%;">
<el-table-column
type="selection"
header-align="center"
align="center"
width="50">
</el-table-column>
<el-table-column
prop="custCode"
header-align="center"
align="center"
label="客户代码">
</el-table-column>
<el-table-column
prop="custName"
header-align="center"
align="center"
label="客户名称">
</el-table-column>
<el-table-column
prop="licenseNumber"
header-align="center"
align="center"
label="营业执照号码">
</el-table-column>
<el-table-column
prop="contactWay"
header-align="center"
align="center"
label="联系方式">
</el-table-column>
<el-table-column
prop="status"
header-align="center"
align="center"
label="状态">
</el-table-column>
<el-table-column
prop="contactPerson"
header-align="center"
align="center"
label="联系人">
</el-table-column>
<el-table-column
prop="remark"
header-align="center"
align="center"
label="备注">
</el-table-column>
<el-table-column
fixed="right"
header-align="center"
align="center"
width="150"
label="操作">
<template slot-scope="scope">
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ '修改' }}</el-button>
<el-button v-hasPermi="['autogencode:cmcust:delete']" type="text" size="small" @click="deleteHandle(scope.row.id)" style="color: #f56c6c;">删除</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
@size-change="sizeChangeHandle"
@current-change="currentChangeHandle"
:current-page="pageIndex"
:page-sizes="[10, 20, 50, 100]"
:page-size="pageSize"
:total="totalPage"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
<!-- 表单弹窗, 新增数据和修改数据 -->
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
</div>
</template>
<script>
import AddOrUpdate from './cmcust-add-and-update'
import * as api from '@/api/cmcust.js'
export default {
data () {
return {
dataForm: {
custCode: '',
custName: '',
licenseNumber: '',
contactWay: '',
status: '',
contactPerson: '',
remark: '',
},
// 重置表单
resetForm() {
this.dataForm = {
custCode: '',
custName: '',
licenseNumber: '',
contactWay: '',
status: '',
contactPerson: '',
remark: '',
}
},
dataList: [],
pageIndex: 1,
pageSize: 10,
totalPage: 0,
dataListLoading: false,
dataListSelections: [],
addOrUpdateVisible: false
}
},
components: {
AddOrUpdate
},
activated () {
this.getDataList()
},
methods: {
// 获取数据列表
getDataList () {
this.dataListLoading = true
// 根据后端CmCustController和PageParamRequest的期望格式构建参数
const params = {
page: this.pageIndex,
limit: this.pageSize
}
// 将查询条件添加到参数中
if (this.dataForm.custCode) params.custCode = this.dataForm.custCode;
if (this.dataForm.custName) params.custName = this.dataForm.custName;
if (this.dataForm.licenseNumber) params.licenseNumber = this.dataForm.licenseNumber;
if (this.dataForm.contactWay) params.contactWay = this.dataForm.contactWay;
if (this.dataForm.status) params.status = this.dataForm.status;
if (this.dataForm.contactPerson) params.contactPerson = this.dataForm.contactPerson;
if (this.dataForm.remark) params.remark = this.dataForm.remark;
api.cmcustListApi(params).then(res => {
this.dataListLoading = false
this.dataList = res.list || [];
this.totalPage = res.total;
}).catch(e => {
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
},
// 新增 / 修改
addOrUpdateHandle (id) {
this.addOrUpdateVisible = true
this.$nextTick(() => {
this.$refs.addOrUpdate.init(id)
})
},
// 删除处理(支持单个删除和批量删除)
deleteHandle (id) {
let ids = []
let idText = ''
// 如果传入了单个id参数则为单个删除
if (id) {
ids = [id]
idText = id
} else {
// 否则为批量删除
ids = this.dataListSelections.map(item => {
return item.id
})
idText = ids.join(',')
}
this.$confirm(`确定进行删除操作?`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
// 调用批量删除API
api.cmcustDeleteApi(ids).then(res => {
this.$message.success('删除成功')
this.getDataList()
})
})
},
}
}
</script>