2024-09-09 修改了大部分下拉组件为模糊筛选,减轻前端渲染压力

This commit is contained in:
2024-09-09 15:26:17 +08:00
parent fe5d3b70df
commit 563132273c
717 changed files with 107188 additions and 138520 deletions

View File

@@ -0,0 +1,652 @@
<template>
<div class="app-container">
<el-card style="height: 790px">
<div style="margin-top: 7px; margin-bottom: 7px">
<el-select
v-model="customerNameValue"
:remote-method="getCustomer"
style="width:200px"
placeholder="买方名称"
size="small"
filterable
clearable
remote
@change="pageCurrent = 1;pageSize = 100;searchTable();getCustomerNo(contractNoValue)">
<el-option
v-for="item in customerName"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<el-select
v-model="contractNoValue"
:remote-method="getCustomerNo"
style="width:200px"
placeholder="合同编号"
size="small"
filterable
clearable
remote
@change="pageCurrent = 1;pageSize = 100;searchTable()">
<el-option
v-for="item in contractNo"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<span style="font-size: 13px;color: black">创建日期</span>
<el-date-picker
v-model="dateRange"
size="small"
type="daterange"
align="center"
style="width: 240px;"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
range-separator=""
start-placeholder="开始日期"
end-placeholder="结束日期"
@change="pageCurrent = 1;pageSize = 100;searchTable()"/>
<!--<el-select v-model="orderValue" style="width:200px" placeholder="订单编号" size="small" filterable clearable @change="pageCurrent = 1;pageSize = 100;searchTable()">
<el-option
v-for="item in orderArray"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>-->
<el-select
v-model="orderStateValue"
style="width:100px"
placeholder="订单状态"
size="small"
filterable
clearable
@change="pageCurrent = 1;pageSize = 100;searchTable()">
<el-option
v-for="item in orderState"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<el-checkbox v-model="checked" @change="pageCurrent = 1;pageSize = 100;searchTable()">全部</el-checkbox>
<el-button
icon="el-icon-search"
type="primary"
plain
size="small"
@click="pageCurrent = 1;pageSize = 100;searchTable()">查询
</el-button>
<el-button
icon="el-icon-phone"
type="primary"
plain
size="small"
style="margin-left: 250px"
@click="DeliveryNotice()">通知发货
</el-button>
</div>
<el-col style="width: 981px">
<el-table
v-loading="loading"
:data="tableData"
highlight-current-row
border
stripe
size="small"
style="width: 981px"
height="680px"
@row-click="searchTable1"
@sort-change="sortChange">
<el-table-column width="60px" label="状态" align="center" prop="状态">
<template slot-scope="scope">
{{ scope.row.订单状态 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('订单编号')" label="订单编号" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.订单编号 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('买方名称')" label="买方" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.买方 }}
</template>
</el-table-column>
<el-table-column label="客户要求" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.客户要求 }}
</template>
</el-table-column>
<el-table-column width="80px" label="合同备注" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.合同备注 }}
</template>
</el-table-column>
<el-table-column width="105px" label="交货日期" align="center" sortable="完成期限" prop="完成期限">
<template slot-scope="scope">
{{ scope.row.完成期限 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('日期')" label="合同金额" align="center">
<template slot-scope="scope">
{{ scope.row.合同金额 ? Number(scope.row.合同金额).toFixed(2) : '' }}
</template>
</el-table-column>
<el-table-column width="90px" label="收款日期" align="center">
<template slot-scope="scope">
{{ scope.row.收款日期 }}
</template>
</el-table-column>
<el-table-column width="90px" label="已收款项" align="center">
<template slot-scope="scope">
{{ scope.row.未收款项 ? Number(scope.row.未收款项).toFixed(2) : '' }}
</template>
</el-table-column>
<el-table-column width="90px" label="未收款项" align="center">
<template slot-scope="scope">
{{ scope.row.已收款项 ? Number(scope.row.已收款项).toFixed(2) : '' }}
</template>
</el-table-column>
<el-table-column width="160px" align="center" label="操作">
<template slot-scope="scope">
<el-button type="text" size="mini" icon="el-icon-edit" @click="Collection(scope.row)">收款</el-button>
<el-button type="text" size="mini" icon="el-icon-search" @click="searchTable2(scope.row)">记录</el-button>
</template>
</el-table-column>
</el-table>
<div class="block" style="margin-top: 10px;">
<el-pagination
:current-page="pageCurrent"
:page-sizes="[10, 20, 30, 40, 100]"
:page-size="pageSize"
:total="total"
:pager-count="5"
layout="total, prev, pager, next"
@size-change="handleSizeChanges"
@current-change="handleCurrentChanges"/>
</div>
</el-col>
<el-col style="margin-left: 10px;width: 671px">
<el-table
:data="tableData1"
:header-cell-style="{background: '#2283D4',color: 'white'}"
highlight-current-row
border
stripe
size="small"
style="width: 721px"
height="680px"
@selection-change="handleSelectionChange">
<el-table-column :selectable="selectable" align="center" width="50" type="selection"/>
<el-table-column :width="setColumnWidth('状态')" label="产品状态" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.任务状态 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('产品名称')" label="产品名称" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.产品名称 }}
</template>
</el-table-column>
<el-table-column width="75px" label="订单数量" align="center">
<template slot-scope="scope">
{{ scope.row.数量 }}
</template>
</el-table-column>
<el-table-column width="60px" label="完成数" align="center">
<template slot-scope="scope">
{{ scope.row.完成数量 }}
</template>
</el-table-column>
<el-table-column width="90px" label="已通知发货" align="center">
<template slot-scope="scope">
{{ scope.row.已通知发货数量 }}
</template>
</el-table-column>
<el-table-column width="60px" label="已发数" align="center">
<template slot-scope="scope">
{{ scope.row.已发数量 }}
</template>
</el-table-column>
<el-table-column label="本次发货数" align="center">
<template slot-scope="scope">
<el-input-number
v-model="scope.row.本次发货数"
:max="scope.row.数量-scope.row.已通知发货数量"
:min="0"
style="width: 100%"
size="small"/>
</template>
</el-table-column>
</el-table>
</el-col>
</el-card>
<el-dialog v-el-drag-dialog :visible.sync="dialogFormVisible" title="已收款" center width="400px">
<el-form
ref="form"
:model="form"
:rules="rules"
label-position="center"
label-width="110px"
class="demo-ruleForm">
<el-row>
<el-col :span="12">
<el-form-item label="已收金额" prop="moneyValue">
<el-input-number
v-model="form.moneyValue"
:min="0"
:step="1"
size="small"
style="width:200px"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="备注">
<el-input
v-model="form.备注"
size="small"
style="width:200px"/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button size="small" @click="callOff1()">取消</el-button>
<el-button type="distribution" size="small" @click="updateMoney()">确定</el-button>
</div>
</el-dialog>
<el-dialog v-el-drag-dialog :visible.sync="dialogFormVisible1" title="收款记录" center width="500px">
<el-table
:data="tableData2"
:header-cell-style="{background: '#2283D4',color: 'white'}"
highlight-current-row
border
stripe
size="small"
style="width: 460px"
height="300px">
<el-table-column align="center" width="60" type="index" label="序号"/>
<el-table-column width="100px" label="收款金额" align="center">
<template slot-scope="scope">
{{ scope.row.金额 }}
</template>
</el-table-column>
<el-table-column width="100px" label="收款时间" align="center">
<template slot-scope="scope">
{{ scope.row.时间 }}
</template>
</el-table-column>
<el-table-column label="备注" align="center">
<template slot-scope="scope">
{{ scope.row.备注 }}
</template>
</el-table-column>
<el-table-column width="100px" align="center" label="操作">
<template slot-scope="scope">
<el-button type="text" size="mini" icon="el-icon-edit" @click="update(scope.row)">修改金额</el-button>
</template>
</el-table-column>
</el-table>
</el-dialog>
<el-dialog v-el-drag-dialog :visible.sync="dialogFormVisible2" title="收款金额" center width="400px">
<el-form
ref="form1"
:model="form1"
:rules="rules1"
label-position="center"
label-width="110px"
class="demo-ruleForm">
<el-row>
<el-col :span="12">
<el-form-item label="收款金额" prop="moneyValue">
<el-input-number
v-model="form1.moneyValue"
:min="0"
:step="1"
size="small"
style="width:200px"/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button size="small" @click="dialogFormVisible2=false">取消</el-button>
<el-button type="distribution" size="small" @click="submitUpdate()">确定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
export default {
data() {
return {
numberValue: '',
contractNo: [],
contractNoValue: '',
checked: false,
customerNameValue: '', // 买方名称
customerName: [], // 买方名称数组
orderValue: '', // 订单编号
orderArray: [], // 订单编号数组
dateRange: '', // 下单日期
orderStateValue: '', // 订单状态
orderState: [], // 合同状态数组
loading: false, // 数据加载
projectValue: '',
dialogFormVisible: false,
dialogFormVisible1: false,
dialogFormVisible2: false,
tableData2: [],
form: {
moneyValue: '',
备注: ''
},
rules: {
moneyValue: [{ required: true, message: '请输入收款金额', trigger: 'blur' }]
},
form1: {
moneyValue: ''
},
rules1: {
moneyValue: [{ required: true, message: '请输入收款金额', trigger: 'blur' }]
},
moneyValue: '',
multipleSelection: [],
multipleSelection_variable: [],
deliveryNum: [],
orderFloatValue: '',
groupNum: [],
total: 0, // 分页总数
tableData: [], // 订单信息表
tableData1: [], // 产品信息表
pageCurrent: 1, // 分页当前页
pageSize: 100, // 分页每页显示条数
orderName: '', // 排序列名
order: '' // 排序方式
}
},
computed: {
...mapGetters([
'id',
'token'
])
},
created() {
this.fetchData()
this.getCustomerNo(this.contractNoValue)
this.searchTable()
},
methods: {
searchTable2(row) {
var param = []
param[0] = ['项目流水号', row.项目流水号]
var Data = this.CreateData('11', '发货通知_订单信息_收款查看', param)
this.ExecDatabase(Data).then(response => {
this.tableData2 = response.data
this.dialogFormVisible1 = true
})
},
getCustomerNo(query) {
this.contractNo = []
this.contractNoValue = ''
let check
this.customerNameValue ? check = 1 : check = 0
var param = []
param[0] = ['买方名称_check', check]
param[1] = ['买方名称', this.customerNameValue]
param[2] = ['订单编号', query]
var Data = this.CreateData('11', '订单信息_列表_通过客户_查询数据_BAK', param)
this.ExecDatabase(Data).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.contractNo.push({
label: response.data[i].订单编号,
value: response.data[i].订单流水号
})
}
})
},
fetchData() {
this.getCustomer()
this.getOrder('')
this.getOrderState()
},
update(row) {
if (this.$refs['form1'] !== undefined) {
this.$refs['form1'].resetFields()
}
this.form1.moneyValue = row.金额
this.numberValue = row.id
this.projectValue = row.项目流水号
this.dialogFormVisible2 = true
},
submitUpdate() {
this.$refs['form1'].validate((valid) => {
if (valid) {
var param = []
param[0] = ['项目流水号', this.projectValue]
param[1] = ['金额', this.form1.moneyValue]
param[2] = ['id', this.numberValue]
var Data = this.CreateData('12', '发货通知_订单信息_收款记录修改', param)
this.ExecDatabase(Data).then(response => {
if (response.data[0].result === '1') {
this.$message.success('更改成功')
this.searchTable()
var param = []
param[0] = ['项目流水号', this.projectValue]
var Data = this.CreateData('11', '发货通知_订单信息_收款查看', param)
this.ExecDatabase(Data).then(response => {
this.tableData2 = response.data
})
this.dialogFormVisible2 = false
} else {
this.$message.warning('更改失败!')
}
})
} else {
return false
}
})
},
Collection(row) {
if (this.$refs['form'] !== undefined) {
this.$refs['form'].resetFields()
}
this.projectValue = row.项目流水号
this.dialogFormVisible = true
},
callOff1() {
this.dialogFormVisible = false
},
updateMoney() {
this.$refs['form'].validate((valid) => {
if (valid) {
var param = []
param[0] = ['项目流水号', this.projectValue]
param[1] = ['收款金额', this.form.moneyValue]
param[2] = ['备注', this.form.备注]
var Data = this.CreateData('12', '发货通知_订单信息_收款', param)
this.ExecDatabase(Data).then(response => {
if (response.data[0].result === '1') {
this.$message.success('更改成功')
this.searchTable()
this.dialogFormVisible = false
} else {
this.$message.warning('更改失败!')
}
})
} else {
return false
}
})
},
cancelShipment(row) {
var param = []
param[0] = ['订单流水号', row.订单流水号]
var Data = this.CreateData('12', '发货通知_取消发货', param)
this.ExecDatabase(Data).then(response => {
if (response.data[0].result === '1') {
this.$message.success('取消发货成功')
this.searchTable()
} else {
this.$message.warning('取消发货失败!')
}
})
},
getCustomer(query) {
this.customerName = []
var param = []
param[0] = ['客户名称', query]
var Data = this.CreateData('11', '合同管理_客户信息_查询数据_bak', param)
this.ExecDatabase(Data).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.customerName.push({
label: response.data[i].客户名称,
value: response.data[i].客户流水号
})
}
})
},
getOrder(query) {
this.orderArray = []
var param = []
param[0] = ['订单编号', query]
var Data = this.CreateData('11', '订单信息_列表_查询数据_bak', param)
this.ExecDatabase(Data).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.orderArray.push({
label: response.data[i].订单编号,
value: response.data[i].订单流水号
})
}
})
},
getOrderState() {
var param = []
var Data = this.CreateData('11', '订单状态_查询', param)
this.ExecDatabase(Data).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.orderState.push({
label: response.data[i].订单状态,
value: response.data[i].订单状态流水号
})
}
})
},
selectable(row) {
return row.本次发货数 > 0 && row.数量 - row.已通知发货数量 > 0
},
searchTable() {
let customerNameValue_check, orderValue_check, dateRange_check, orderStateValue_check, check
this.customerNameValue ? customerNameValue_check = 1 : customerNameValue_check = 0
this.contractNoValue ? orderValue_check = 1 : orderValue_check = 0
this.dateRange ? dateRange_check = 1 : (dateRange_check = 0, this.dateRange = '')
if (this.orderStateValue === 0) {
orderStateValue_check = 1
} else if (this.orderStateValue) {
orderStateValue_check = 1
} else {
orderStateValue_check = 0
}
this.checked ? check = 1 : check = 0
var param = []
param[0] = ['买方名称_check', customerNameValue_check]
param[1] = ['客户流水号', this.customerNameValue]
param[2] = ['订单编号_check', orderValue_check]
param[3] = ['订单流水号', this.contractNoValue]
param[4] = ['下单日期_check', dateRange_check]
param[5] = ['开始时间', this.dateRange[0]]
param[6] = ['结束时间', this.dateRange[1]]
param[7] = ['订单状态_check', orderStateValue_check]
param[8] = ['订单状态', this.orderStateValue]
param[9] = ['是合全部_check', check]
param[10] = ['排序名称', this.orderName]
param[11] = ['排序方式', this.order]
var Data = this.CreateData('11', '发货通知_订单信息_查询数据', param, this.pageSize, this.pageCurrent)
this.ExecDatabase(Data).then(response => {
this.tableData = response.data.rows
this.total = response.data.total
})
},
searchTable1(row) {
this.orderFloatValue = row.订单流水号
var param = []
param[0] = ['订单流水号', row.订单流水号]
var Data = this.CreateData('11', '发货通知_产品信息_查询数据', param)
this.ExecDatabase(Data).then(response => {
this.tableData1 = response.data
})
},
sortChange(column) {
if (column.prop === '完成期限') {
this.orderName = 1
} else if (column.prop === '调拨日期') {
this.orderName = 2
} else {
this.orderName = 0
}
if (column.order === 'ascending') {
this.order = 1
} else if (column.order === 'descending') {
this.order = 2
} else {
this.order = ''
}
this.searchTable()
},
handleSelectionChange(val) {
this.multipleSelection = val
},
DeliveryNotice() {
if (this.multipleSelection.length !== 0) {
this.multipleSelection_variable = this.multipleSelection
this.multipleSelection = []
this.deliveryNum = []
this.groupNum = []
for (let i = 0; i < this.multipleSelection_variable.length; i++) {
this.deliveryNum[i] = this.multipleSelection_variable[i].本次发货数
this.groupNum[i] = this.multipleSelection_variable[i].组件流水号
}
var param = []
param[0] = ['本次发货数组', this.deliveryNum]
param[1] = ['组件流水号组', this.groupNum]
var Data = this.CreateData('12', '发货管理_通知发货', param)
this.ExecDatabase(Data).then(response => {
if (response.data[0].result === '1') {
this.$message.success('通知成功')
var param1 = []
param1[0] = ['订单流水号', this.orderFloatValue]
var Data1 = this.CreateData('11', '发货通知_产品信息_查询数据', param1)
this.ExecDatabase(Data1).then(response => {
this.tableData1 = response.data
})
} else {
this.$message.success('通知失败')
}
})
} else {
this.$message.warning('请勾选要发货的产品')
}
},
handleSizeChanges(val) {
this.pageCurrent = 1
this.pageSize = val
this.searchTable()
},
handleCurrentChanges(val) {
this.pageCurrent = val
this.searchTable()
}
}
}
</script>
<style>
.ziduan {
width: 50px !important;
}
</style>

View File

@@ -0,0 +1,59 @@
<template>
<div>
<el-card>
<el-tabs v-model="activeName" type="border-card" @tab-click="Refresh">
<el-tab-pane label="下单通知" name="1"><orderNotice ref="fresh1"/></el-tab-pane>
<el-tab-pane label="付款通知" name="2"><paymentOrder ref="fresh2"/></el-tab-pane>
<el-tab-pane label="发货通知" name="3"><DeliveryNotice ref="fresh3"/></el-tab-pane>
</el-tabs>
</el-card>
</div>
</template>
<script>
import orderNotice from '@/views/SalesManagement/DeliveryNotice/orderNotice.vue'
import paymentOrder from '@/views/SalesManagement/DeliveryNotice/paymentOrder.vue'
import DeliveryNotice from '@/views/SalesManagement/DeliveryNotice/DeliveryNotice.vue'
export default {
components: {
'orderNotice': orderNotice,
'paymentOrder': paymentOrder,
'DeliveryNotice': DeliveryNotice
},
data() {
return {
activeName: '1',
label: '`',
isDisable: true
}
},
methods: {
Refresh() {
switch (this.activeName) {
case '1': {
this.label = '`'
this.isDisable = true
break
}
case '2': {
this.label = '`'
this.isDisable = true
break
}
case '3': {
this.label = '`'
this.isDisable = true
break
}
}
}
}
}
</script>
<style scoped lang="scss">
/deep/ .el-card__body{
padding: 0px!important;
}
</style>

View File

@@ -0,0 +1,294 @@
<template>
<div class="app-container">
<el-card style="height: 790px">
<div style="margin-top: 7px; margin-bottom: 7px">
<el-input v-model="customerNameValue" style="width:200px" placeholder="买方名称/收货人" size="small" clearable/>
<el-select
v-model="contractNoValue"
:remote-method="getCustomerNo"
style="width:200px"
placeholder="合同编号"
size="small"
filterable
clearable
remote>
<el-option
v-for="item in contractNo"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<span style="font-size: 13px;color: black">通知日期</span>
<el-date-picker
v-model="dateRange"
size="small"
placeholder="选择日期"
align="center"
style="width:200px"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
@change="pageCurrent = 1;pageSize = 20;searchTable()"
/>
<el-button
icon="el-icon-search"
type="primary"
plain
size="small"
style="margin-left: 10px"
@click="pageCurrent = 1;pageSize = 20;searchTable()">查询
</el-button>
</div>
<el-col style="width: 1461px">
<el-table
v-loading="loading"
:data="tableData"
height="680px"
highlight-current-row
border
stripe
size="small"
style="width: 1461px">
<el-table-column :width="setColumnWidth('合同编号')" label="合同编号" align="center" prop="合同编号">
<template slot-scope="scope">
{{ scope.row.合同编号 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('买方名称')" label="买方名称" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.买方名称 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('金额')" label="合同金额(元)" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.合同金额 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('日期')" label="交货期限" align="center">
<template slot-scope="scope">
{{ scope.row.交货期限 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('付款方式')" label="付款方式" align="center">
<template slot-scope="scope">
{{ scope.row.付款方式 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('税率')" label="税率" align="center">
<template slot-scope="scope">
{{ scope.row.税率 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('姓名')" label="收货人" align="center">
<template slot-scope="scope">
{{ scope.row.收货人 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('备注')" label="合同备注" align="center">
<template slot-scope="scope">
{{ scope.row.合同备注 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('日期')" label="签订日期" align="center">
<template slot-scope="scope">
{{ scope.row.签订日期 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('姓名')" label="创建人" align="center">
<template slot-scope="scope">
{{ scope.row.创建人 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('日期')" label="提交日期" align="center">
<template slot-scope="scope">
{{ scope.row.提交日期 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('姓名')" label="通知人" align="center">
<template slot-scope="scope">
{{ scope.row.通知人 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('日期')" label="通知日期" align="center">
<template slot-scope="scope">
{{ scope.row.通知日期 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('备注')" align="center" label="操作">
<template slot-scope="scope">
<el-button type="text" size="mini" @click="noticeOrder(scope.row)">通知下单</el-button>
</template>
</el-table-column>
</el-table>
<div class="block" style="margin-top: 10px;">
<el-pagination
:current-page="pageCurrent"
:page-sizes="[10, 20, 30, 40, 100]"
:page-size="pageSize"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="handleSizeChanges"
@current-change="handleCurrentChanges"/>
</div>
</el-col>
</el-card>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
export default {
data() {
return {
customerNameValue: '', // 买方名称
customerName: [], // 买方名称数组
contractNoValue: '', // 合同编号
contractNo: [], // 合同编号数组
// orderValue: '', // 订单编号
// orderArray: [], // 订单编号数组
dateRange: '', // 通知日期
orderStateValue: '', // 订单状态
orderState: [], // 合同状态数组
loading: false, // 数据加载
total: 0, // 分页总数
tableData: [], // 订单信息表
tableData100: [],
pageCurrent: 1, // 分页当前页
pageSize: 20, // 分页每页显示条数
orderName: '', // 排序列名
order: '' // 排序方式
}
},
computed: {
...mapGetters([
'id',
'token'
])
},
created() {
this.fetchData()
},
methods: {
fetchData() {
this.getCustomer('')
this.getCustomerNo('')
},
getCustomer(query) {
this.customerName = []
var param = []
param[0] = ['客户名称', query]
var Data = this.CreateData('11', '合同管理_客户信息_查询数据_bak', param)
this.ExecDatabase(Data).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.customerName.push({
label: response.data[i].客户名称,
value: response.data[i].客户流水号
})
}
})
},
getCustomerNo(query) {
this.contractNo = []
var param = []
param[0] = ['合同编号', query]
var Data = this.CreateData('11', '合同管理_合同编号_查询数据_BAK', param)
this.ExecDatabase(Data).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.contractNo.push({
label: response.data[i].合同编号,
value: response.data[i].合同编号
})
}
})
},
searchTable() {
let dateRange_check
this.tableData100 = []
if (this.customerNameValue) {
this.customerNameValue_check = 1
} else {
this.customerNameValue_check = 0
}
if (this.contractNoValue) {
this.contractNoValue_check = 1
} else {
this.contractNoValue_check = 0
}
// this.customerNameValue ? customerNameValue_check = 1 : customerNameValue_check = 0
// this.contractNoValue ? contractNoValue_check = 1 : contractNoValue_check = 0
this.dateRange ? dateRange_check = 1 : (dateRange_check = 0, this.dateRange = '')
var param = []
param[0] = ['买方名称_check', this.customerNameValue_check]
param[1] = ['客户', this.customerNameValue]
param[2] = ['合同编号_check', this.contractNoValue_check]
param[3] = ['合同编号', this.contractNoValue]
param[4] = ['通知日期_check', dateRange_check]
param[5] = ['通知日期', this.dateRange]
console.log(param)
var Data = this.CreateData('11', '会计通知_下单通知_查询数据_bak', param, this.pageSize, this.pageCurrent)
this.ExecDatabase(Data).then(response => {
if (response.data.rows.length !== 0) {
for (let i = 0; i < response.data.rows.length; i++) {
this.tableData100.push({
项目流水号: response.data.rows[i].项目流水号,
合同编号: response.data.rows[i].合同编号,
买方名称: response.data.rows[i].客户名称,
合同金额: response.data.rows[i].合同金额,
交货期限: response.data.rows[i].交货期限,
付款方式: response.data.rows[i].付款方式,
税率: response.data.rows[i].税率,
收货人: response.data.rows[i].收货人员,
合同备注: response.data.rows[i].合同备注,
签订日期: response.data.rows[i].签订日期,
提交日期: response.data.rows[i].提交日期,
创建人: response.data.rows[i].创建人,
通知人: response.data.rows[i].通知人,
通知日期: response.data.rows[i].通知日期
})
}
}
this.total = response.data.total
}).then(() => {
this.tableData = this.tableData100
})
},
noticeOrder(row) {
this.$confirm('是否确认通知?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
var param = []
param[0] = ['项目流水号', row.项目流水号]
param[1] = ['通知人', this.id]
var Data = this.CreateData('12', '会计通知_下单通知', param)
this.ExecDatabase(Data).then(response => {
if (response.data[0].result === '1') {
this.$message.success('通知成功')
this.searchTable()
} else {
this.$message.error('通知失败')
}
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消确认'
})
})
},
handleSizeChanges(val) {
this.pageCurrent = 1
this.pageSize = val
this.searchTable()
},
handleCurrentChanges(val) {
this.pageCurrent = val
this.searchTable()
}
}
}
</script>
<style lang="scss" scoped>
</style>

View File

@@ -0,0 +1,403 @@
<template>
<div class="app-container">
<el-card style="height: 850px">
<div style="margin-top: 7px; margin-bottom: 7px">
<el-select
v-model="supplierName"
style="width:150px; text-align: center"
placeholder="供应商"
size="small"
clearable
filterable
@change="pageCurrent=1;searchTable();getContract()">
<el-option
v-for="item in suppliers"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<el-select
v-model="contractValue"
:remote-method="getContract"
style="width:150px; text-align: center"
placeholder="合同号"
size="small"
clearable
filterable
remote
@change="pageCurrent=1;searchTable()">
<el-option
v-for="item in contract"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<el-select
v-model="purchaseState"
style="width:100px;"
size="small"
placeholder="采购状态"
filterable
clearable
@change="pageCurrent=1;searchTable()">
<el-option
v-for="item in purchaseStates"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<span style="font-size: 13px;color: black">付款日期</span>
<el-date-picker
v-model="dateRange"
size="small"
type="daterange"
align="center"
style="width: 240px;"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
range-separator=""
start-placeholder="开始日期"
end-placeholder="结束日期"
@change="pageCurrent = 1;searchTable()"/>
<el-button
icon="el-icon-search"
type="primary"
plain
size="small"
style="margin-left: 10px;"
@click="pageCurrent = 1;searchTable()">查询
</el-button>
</div>
<el-col style="width: 821px">
<el-table
v-loading="loading"
:data="tableData"
highlight-current-row
border
stripe
size="small"
height="680px"
style="width: 821px"
@row-click="searchTable1">
<el-table-column :width="setColumnWidth('状态')" label="采购状态" align="center" prop="采购状态">
<template slot-scope="scope">
{{ scope.row.采购状态 }}
</template>
</el-table-column>
<el-table-column width="130px" label="采购合同号" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.采购合同号 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('买方名称')" label="供应商" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.供应商 }}
</template>
</el-table-column>
<el-table-column width="100px" label="合同金额" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.合同金额 ? Number(scope.row.合同金额).toFixed(2) : 0.00 }}
</template>
</el-table-column>
<el-table-column width="90px" label="付款金额" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.付款金额 ? Number(scope.row.付款金额).toFixed(2) : 0.00 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('日期')" label="付款日期" align="center">
<template slot-scope="scope">
{{ scope.row.付款日期 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('日期')" label="审批时间" align="center">
<template slot-scope="scope">
{{ scope.row.审批时间 }}
</template>
</el-table-column>
<el-table-column align="center" label="操作">
<template slot-scope="scope">
<el-button type="text" size="mini" @click="paymentOrder(scope.row)">付款通知</el-button>
</template>
</el-table-column>
</el-table>
<div class="block" style="margin-top: 10px;">
<el-pagination
:current-page="pageCurrent"
:page-sizes="[10, 20, 30, 40, 100]"
:page-size="pageSize"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="handleSizeChanges"
@current-change="handleCurrentChanges"/>
</div>
</el-col>
<el-col style="margin-top: 10px;margin-left: 30px;width: 801px">
<el-table
:data="tableData1"
:header-cell-style="{background: '#2283D4',color: 'white'}"
highlight-current-row
border
stripe
size="small"
height="680px"
style="width: 801px">
<el-table-column type="index" label="序号" align="center" width="50"/>
<el-table-column :width="setColumnWidth('采购件')" label="采购件" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.采购件 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('图号')" label="图号/规格" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.图号或型号 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('材料')" label="材料" align="center" show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.材料 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('数量')" label="数量" align="center">
<template slot-scope="scope">
{{ scope.row.采购数 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('单位')" label="单位" align="center">
<template slot-scope="scope">
{{ scope.row.单位 }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('单价')" label="单价(元)" align="center">
<template slot-scope="scope">
{{ scope.row.单价 ? Number(scope.row.单价).toFixed(2) : '' }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('单价')" label="金额" align="center">
<template slot-scope="scope">
{{ scope.row.金额 ? Number(scope.row.金额).toFixed(2) : '' }}
</template>
</el-table-column>
<el-table-column :width="setColumnWidth('备注')" label="采购备注" align="center">
<template slot-scope="scope">
{{ scope.row.采购备注 }}
</template>
</el-table-column>
</el-table>
</el-col>
<el-dialog v-el-drag-dialog :visible.sync="dialogFormVisible" title="付款通知" center width="350px">
<el-form
ref="form"
:model="form"
:rules="rules"
label-position="left"
class="demo-ruleForm"
label-width="100px"
style="margin: auto">
<el-form-item label="付款金额" prop="paymentAmount">
<el-input-number
v-model="form.paymentAmount"
:min="0"
:max="MaxMoney"
style="width: 180px"
size="small"
clearable
placeholder="请输入付款金额"/>
</el-form-item>
<el-form-item label="付款时间" prop="paymentTime1">
<el-date-picker
v-model="form.paymentTime1"
size="small"
align="center"
style="width: 180px"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
placeholder="请选择付款时间"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" size="small" @click="submitSuccession('form')"> </el-button>
</div>
</el-dialog>
</el-card>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
import { getNowShotTime } from '@/utils/tool'
export default {
data() {
return {
purchaseStates: [],
purchaseState: '',
suppliers: [],
supplierName: '',
contractValue: '',
contract: [],
paymentTime: '', // 付款时间
dateRange: '', // 通知日期
loading: false, // 数据加载
dialogFormVisible: false,
title: '',
MaxMoney: 0,
form: {
paymentAmount: '',
paymentTime1: ''
},
rules: {
paymentAmount: [{ required: true, message: '请输入' }],
paymentTime1: [{ required: true, message: '请选择' }]
},
multipleSelection: [],
multipleSelection_variable: [],
deliveryNum: [],
orderFloatValue: '',
groupNum: [],
total: 0, // 分页总数
tableData: [], // 订单信息表
tableData1: [], // 产品信息表
pageCurrent: 1, // 分页当前页
pageCurrent1: 1, // 分页当前页
pageSize: 100, // 分页每页显示条数
orderName: '', // 排序列名
order: '' // 排序方式
}
},
computed: {
...mapGetters([
'id',
'token'
])
},
created() {
this.fetchData()
},
methods: {
fetchData() {
this.getSuppliers()
this.getContract()
this.getState()
this.searchTable()
},
getSuppliers() {
var param = []
var Data = this.CreateData('11', '供应商_查询', param)
this.ExecDatabase(Data).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.suppliers.push({
label: response.data[i].供应商名称,
value: response.data[i].供应商流水号
})
}
})
},
getContract(query) {
this.contract = []
let supplierName_check
this.supplierName ? supplierName_check = 1 : supplierName_check = 0
var param = []
param[0] = ['供应商流水号_check', supplierName_check]
param[1] = ['供应商流水号', this.supplierName]
param[2] = ['采购合同编号', query]
var Data = this.CreateData('11', '仓储管理_采购合同_通过供应商查询_BAK', param)
this.ExecDatabase(Data).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.contract.push({
label: response.data[i].采购合同编号,
value: response.data[i].采购合同流水号
})
}
})
},
getState() {
var param = []
var Data = this.CreateData('11', '采购管理_采购合同查询_采购状态_查询', param)
this.ExecDatabase(Data).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.purchaseStates.push({
label: response.data[i].采购状态名称,
value: response.data[i].采购状态流水号
})
}
})
},
searchTable() {
this.tableData1 = []
let supplierName_check, contractValue_check, purchaseState_check, dateRange_check
this.supplierName ? supplierName_check = 1 : supplierName_check = 0
this.contractValue ? contractValue_check = 1 : contractValue_check = 0
this.purchaseState ? purchaseState_check = 1 : purchaseState_check = 0
this.dateRange ? dateRange_check = 1 : (dateRange_check = 0, this.dateRange = '')
var param = []
param[0] = ['供应商流水号_check', supplierName_check]
param[1] = ['供应商流水号', this.supplierName]
param[2] = ['采购合同_check', contractValue_check]
param[3] = ['采购合同流水号', this.contractValue]
param[4] = ['采购状态_check', purchaseState_check]
param[5] = ['采购状态', this.purchaseState]
param[6] = ['付款日期_check', dateRange_check]
param[7] = ['开始时间', this.dateRange[0]]
param[8] = ['结束时间', this.dateRange[1]]
param[9] = ['排序名称', this.orderName]
param[10] = ['排序方式', this.order]
var Data = this.CreateData('11', '采购管理_采购合同_付款通知_查询数据', param, this.pageSize, this.pageCurrent)
this.ExecDatabase(Data).then(response => {
this.tableData = response.data.rows
this.total = response.data.total
})
},
searchTable1(row) {
var param = []
param[0] = ['采购合同流水号', row.采购合同流水号]
var Data = this.CreateData('11', '采购管理_采购合同明细_全部_查询数据', param)
this.ExecDatabase(Data).then(response => {
this.tableData1 = response.data
})
},
paymentOrder(row) {
this.MaxMoney = Number(row.合同金额)
this.form.paymentAmount = Number(row.合同金额) - Number(row.付款金额)
console.log(this.form.paymentAmount, Number(row.合同金额), Number(row.付款金额), row.付款金额)
this.form.paymentTime1 = getNowShotTime()
this.orderFloatValue = row.采购合同流水号
this.dialogFormVisible = true
},
submitSuccession(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
var param = []
param[0] = ['付款金额', this.form.paymentAmount]
param[1] = ['付款时间', this.form.paymentTime1]
param[2] = ['采购合同流水号', this.orderFloatValue]
var Data = this.CreateData('12', '付款通知_增加数据', param)
this.ExecDatabase(Data).then(response => {
if (response.data[0].result === '1') {
this.$message({
message: '付款成功',
type: 'success'
})
this.searchTable()
this.dialogFormVisible = false
} else {
this.$message.error('付款失败')
}
})
} else {
return false
}
})
},
handleSizeChanges(val) {
this.pageCurrent = 1
this.pageSize = val
this.searchTable()
},
handleCurrentChanges(val) {
this.pageCurrent = val
this.searchTable()
}
}
}
</script>
<style lang="scss" scoped>
</style>