✨ feat: 合并
This commit is contained in:
砂糖
417
gear-ui3/src/views/oms/customer/index.vue
Normal file
417
gear-ui3/src/views/oms/customer/index.vue
Normal file
@@ -0,0 +1,417 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="客户名称" prop="name">
|
||||
<el-input
|
||||
v-model="queryParams.name"
|
||||
placeholder="请输入客户名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="客户等级" prop="level">
|
||||
<el-input
|
||||
v-model="queryParams.level"
|
||||
placeholder="请输入客户等级"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="客户来源" prop="source">
|
||||
<el-select v-model="queryParams.source" placeholder="请选择客户来源" clearable>
|
||||
<el-option
|
||||
v-for="dict in dict.type.customer_from"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="customerList" @selection-change="handleSelectionChange" :customColumns="customColumns">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<!-- <el-table-column label="编号，主键自增" align="center" prop="customerId" v-if="false"/>
|
||||
<el-table-column label="客户名称" align="center" prop="name" />
|
||||
<el-table-column label="手机" align="center" prop="mobile" />
|
||||
<el-table-column label="电话" align="center" prop="telephone" />
|
||||
<el-table-column label="QQ" align="center" prop="qq" />
|
||||
<el-table-column label="微信" align="center" prop="wechat" />
|
||||
<el-table-column label="邮箱" align="center" prop="email" />
|
||||
<el-table-column label="地区编号" align="center" prop="areaId" />
|
||||
<el-table-column label="详细地址" align="center" prop="detailAddress" />
|
||||
<el-table-column label="客户等级" align="center" prop="level" />
|
||||
<el-table-column label="客户来源" align="center" prop="source">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.customer_from" :value="scope.row.source"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column> -->
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改CRM 客户对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="客户名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入客户名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="手机" prop="mobile">
|
||||
<el-input v-model="form.mobile" placeholder="请输入手机" />
|
||||
</el-form-item>
|
||||
<el-form-item label="电话" prop="telephone">
|
||||
<el-input v-model="form.telephone" placeholder="请输入电话" />
|
||||
</el-form-item>
|
||||
<el-form-item label="QQ" prop="qq">
|
||||
<el-input v-model="form.qq" placeholder="请输入QQ" />
|
||||
</el-form-item>
|
||||
<el-form-item label="微信" prop="wechat">
|
||||
<el-input v-model="form.wechat" placeholder="请输入微信" />
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱" prop="email">
|
||||
<el-input v-model="form.email" placeholder="请输入邮箱" />
|
||||
</el-form-item>
|
||||
<el-form-item label="地区编号" prop="areaId">
|
||||
<el-input v-model="form.areaId" placeholder="请输入地区编号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="详细地址" prop="detailAddress">
|
||||
<el-input v-model="form.detailAddress" placeholder="请输入详细地址" />
|
||||
</el-form-item>
|
||||
<el-form-item label="客户等级" prop="level">
|
||||
<el-input v-model="form.level" placeholder="请输入客户等级" />
|
||||
</el-form-item>
|
||||
<el-form-item label="客户来源" prop="source">
|
||||
<el-select v-model="form.source" placeholder="请选择客户来源">
|
||||
<el-option
|
||||
v-for="dict in dict.type.customer_from"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="parseInt(dict.value)"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listCustomer, getCustomer, delCustomer, addCustomer, updateCustomer } from "@/api/wms/customer";
|
||||
import KLPTable from '@/components/KLPUI/KLPTable/index.vue';
|
||||
|
||||
export default {
|
||||
name: "Customer",
|
||||
dicts: ['customer_from'],
|
||||
components: {
|
||||
KLPTable
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
customColumns: [
|
||||
{
|
||||
label: '客户名称',
|
||||
prop: 'name'
|
||||
},
|
||||
{
|
||||
label: '手机',
|
||||
prop: 'mobile'
|
||||
},
|
||||
{
|
||||
label: '电话',
|
||||
prop: 'telephone'
|
||||
},
|
||||
{
|
||||
label: 'QQ',
|
||||
prop: 'qq'
|
||||
},
|
||||
{
|
||||
label: '微信',
|
||||
prop: 'wechat'
|
||||
},
|
||||
{
|
||||
label: '邮箱',
|
||||
prop: 'email'
|
||||
},
|
||||
{
|
||||
label: '地区编号',
|
||||
prop: 'areaId'
|
||||
},
|
||||
{
|
||||
label: '详细地址',
|
||||
prop: 'detailAddress',
|
||||
eclipse: true
|
||||
},
|
||||
{
|
||||
label: '客户等级',
|
||||
prop: 'level'
|
||||
},
|
||||
{
|
||||
label: '客户来源',
|
||||
prop: 'source'
|
||||
},
|
||||
{
|
||||
label: '备注',
|
||||
prop: 'remark'
|
||||
},
|
||||
{
|
||||
label: '操作',
|
||||
width: 150,
|
||||
fixed: 'right',
|
||||
render: (h, row) => {
|
||||
const actions = [];
|
||||
actions.push(<el-button type="text" size="mini" icon="el-icon-edit" onClick={() => this.handleUpdate(row)}>修改</el-button>)
|
||||
actions.push(<el-button type="text" size="mini" icon="el-icon-delete" onClick={() => this.handleDelete(row)}>删除</el-button>)
|
||||
return actions;
|
||||
}
|
||||
}
|
||||
],
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// CRM 客户表格数据
|
||||
customerList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
name: undefined,
|
||||
mobile: undefined,
|
||||
telephone: undefined,
|
||||
qq: undefined,
|
||||
wechat: undefined,
|
||||
email: undefined,
|
||||
areaId: undefined,
|
||||
detailAddress: undefined,
|
||||
level: undefined,
|
||||
source: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询CRM 客户列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listCustomer(this.queryParams).then(response => {
|
||||
this.customerList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
customerId: undefined,
|
||||
name: undefined,
|
||||
followUpStatus: undefined,
|
||||
contactLastTime: undefined,
|
||||
contactLastContent: undefined,
|
||||
contactNextTime: undefined,
|
||||
ownerUserId: undefined,
|
||||
ownerTime: undefined,
|
||||
dealStatus: undefined,
|
||||
mobile: undefined,
|
||||
telephone: undefined,
|
||||
qq: undefined,
|
||||
wechat: undefined,
|
||||
email: undefined,
|
||||
areaId: undefined,
|
||||
detailAddress: undefined,
|
||||
industryId: undefined,
|
||||
level: undefined,
|
||||
source: undefined,
|
||||
remark: undefined,
|
||||
createBy: undefined,
|
||||
createTime: undefined,
|
||||
updateBy: undefined,
|
||||
updateTime: undefined,
|
||||
delFlag: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.customerId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加CRM 客户";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const customerId = row.customerId || this.ids
|
||||
getCustomer(customerId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改CRM 客户";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.customerId != null) {
|
||||
updateCustomer(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addCustomer(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const customerIds = row.customerId || this.ids;
|
||||
this.$modal.confirm('是否确认删除CRM 客户编号为"' + customerIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delCustomer(customerIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('wms/customer/export', {
|
||||
...this.queryParams
|
||||
}, `customer_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
294
gear-ui3/src/views/oms/jounery/index.vue
Normal file
294
gear-ui3/src/views/oms/jounery/index.vue
Normal file
@@ -0,0 +1,294 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="日期" prop="journalDate">
|
||||
<el-date-picker clearable v-model="queryParams.journalDate" type="date" value-format="yyyy-MM-dd"
|
||||
placeholder="请选择日期">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="摘要" prop="summary">
|
||||
<el-input v-model="queryParams.summary" placeholder="请输入摘要" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="收支类型" prop="transType">
|
||||
<el-input v-model="queryParams.transType" placeholder="请输入收支类型" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="对方户名" prop="counterpart">
|
||||
<el-input v-model="queryParams.counterpart" placeholder="请输入对方户名" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="收入金额" prop="incomeAmount">
|
||||
<el-input v-model="queryParams.incomeAmount" placeholder="请输入收入金额" clearable
|
||||
@keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="支出金额" prop="expenseAmount">
|
||||
<el-input v-model="queryParams.expenseAmount" placeholder="请输入支出金额" clearable
|
||||
@keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="余额" prop="balanceAmount">
|
||||
<el-input v-model="queryParams.balanceAmount" placeholder="请输入余额" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single"
|
||||
@click="handleUpdate">修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple"
|
||||
@click="handleDelete">删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="journalList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="主键ID" align="center" prop="journalId" v-if="false" />
|
||||
<el-table-column label="日期" align="center" prop="journalDate" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.journalDate, '{y}-{m}-{d}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="摘要" align="center" prop="summary" />
|
||||
<el-table-column label="收支类型" align="center" prop="transType" />
|
||||
<el-table-column label="对方户名" align="center" prop="counterpart" />
|
||||
<el-table-column label="收入金额" align="center" prop="incomeAmount">
|
||||
<!-- 如果不是0用绿字展示，否则用正常颜色 -->
|
||||
<template slot-scope="scope">
|
||||
<span :style="Number(scope.row.incomeAmount) !== 0 ? { color: '#28a745' } : {}">
|
||||
{{ scope.row.incomeAmount }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="支出金额" align="center" prop="expenseAmount">
|
||||
<!-- 如果不是0用红字展示，否则用正常颜色 -->
|
||||
<template slot-scope="scope">
|
||||
<span :style="Number(scope.row.expenseAmount) !== 0 ? { color: '#dc3545' } : {}">
|
||||
{{ scope.row.expenseAmount }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="余额" align="center" prop="balanceAmount" />
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList" />
|
||||
|
||||
<!-- 添加或修改资金日记账对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="日期" prop="journalDate">
|
||||
<el-date-picker clearable v-model="form.journalDate" type="datetime" value-format="yyyy-MM-dd HH:mm:ss"
|
||||
placeholder="请选择日期">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="摘要" prop="summary">
|
||||
<el-input v-model="form.summary" placeholder="请输入摘要" />
|
||||
</el-form-item>
|
||||
<el-form-item label="收支类型" prop="transType">
|
||||
<el-input v-model="form.transType" placeholder="请输入收支类型" />
|
||||
</el-form-item>
|
||||
<el-form-item label="对方户名" prop="counterpart">
|
||||
<el-input v-model="form.counterpart" placeholder="请输入对方户名" />
|
||||
</el-form-item>
|
||||
<el-form-item label="收入金额" prop="incomeAmount">
|
||||
<el-input v-model="form.incomeAmount" :disabled="form.journalId" placeholder="请输入收入金额" />
|
||||
</el-form-item>
|
||||
<el-form-item label="支出金额" prop="expenseAmount">
|
||||
<el-input v-model="form.expenseAmount" :disabled="form.journalId" placeholder="请输入支出金额" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listJournal, getJournal, delJournal, addJournal, updateJournal } from "@/api/finance/journal";
|
||||
|
||||
export default {
|
||||
name: "Journal",
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 资金日记账表格数据
|
||||
journalList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
journalDate: undefined,
|
||||
summary: undefined,
|
||||
transType: undefined,
|
||||
counterpart: undefined,
|
||||
incomeAmount: undefined,
|
||||
expenseAmount: undefined,
|
||||
balanceAmount: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询资金日记账列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listJournal(this.queryParams).then(response => {
|
||||
this.journalList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
journalId: undefined,
|
||||
journalDate: undefined,
|
||||
summary: undefined,
|
||||
transType: undefined,
|
||||
counterpart: undefined,
|
||||
incomeAmount: undefined,
|
||||
expenseAmount: undefined,
|
||||
balanceAmount: undefined,
|
||||
remark: undefined,
|
||||
createBy: undefined,
|
||||
createTime: undefined,
|
||||
updateBy: undefined,
|
||||
updateTime: undefined,
|
||||
delFlag: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.journalId)
|
||||
this.single = selection.length !== 1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加资金日记账";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const journalId = row.journalId || this.ids
|
||||
getJournal(journalId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改资金日记账";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.journalId != null) {
|
||||
updateJournal(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addJournal(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const journalIds = row.journalId || this.ids;
|
||||
this.$modal.confirm('是否确认删除资金日记账编号为"' + journalIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delJournal(journalIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('klp/journal/export', {
|
||||
...this.queryParams
|
||||
}, `journal_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
16
gear-ui3/src/views/oms/order/index.vue
Normal file
16
gear-ui3/src/views/oms/order/index.vue
Normal file
@@ -0,0 +1,16 @@
|
||||
<template>
|
||||
<div>
|
||||
<OrderPage :isPre="false" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import OrderPage from './panels/orderPage.vue';
|
||||
|
||||
export default {
|
||||
name: 'Order',
|
||||
components: {
|
||||
OrderPage
|
||||
}
|
||||
}
|
||||
</script>
|
||||
299
gear-ui3/src/views/oms/order/panels/detail.vue
Normal file
299
gear-ui3/src/views/oms/order/panels/detail.vue
Normal file
@@ -0,0 +1,299 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="Plus" size="mini" :disabled="!canEdit"
|
||||
@click="handleAdd">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="success" plain icon="Edit" size="mini" :disabled="single || !canEdit"
|
||||
@click="handleUpdate">修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="Delete" size="mini" :disabled="multiple || !canEdit"
|
||||
@click="handleDelete">删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="Download" size="mini" @click="handleExport">导出</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="orderDetailList">
|
||||
<el-table-column label="产品" align="center">
|
||||
<template slot-scope="scope">
|
||||
<ProductInfo :product-id="scope.row.productId">
|
||||
<template #default="{ product }">
|
||||
{{ product.productName }}<span v-if="product.productCode">({{ product.productCode }})</span>
|
||||
</template>
|
||||
</ProductInfo>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="BOM" align="center">
|
||||
<template slot-scope="scope">
|
||||
<BomInfoMini item-type="product" :item-id="scope.row.productId" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="产品数量" align="center" prop="quantity" />
|
||||
<el-table-column label="单位" align="center" prop="unit" />
|
||||
<el-table-column label="含税单价" align="center" prop="taxPrice" />
|
||||
<el-table-column label="无税单价" align="center" prop="noTaxPrice" />
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="Edit"
|
||||
@click="handleUpdate(scope.row)">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="Delete"
|
||||
@click="handleDelete(scope.row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<!-- 添加或修改订单明细对话框 -->
|
||||
<el-dialog :title="title" v-model="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="产品" prop="productId">
|
||||
<ProductSelect :can-add="true" v-model="form.productId" placeholder="请选择产品" @change="onProductChange" />
|
||||
</el-form-item>
|
||||
<el-form-item label="产品数量" prop="quantity">
|
||||
<el-input v-model="form.quantity" placeholder="请输入产品数量" />
|
||||
</el-form-item>
|
||||
<el-form-item label="单位" prop="unit">
|
||||
<el-input v-model="form.unit" placeholder="单位" :disabled="true" />
|
||||
</el-form-item>
|
||||
<el-form-item label="含税单价" prop="taxPrice">
|
||||
<el-input-number :controls=false controls-position="right" v-model="form.taxPrice" placeholder="请输入含税单价" />
|
||||
</el-form-item>
|
||||
<el-form-item label="无税单价" prop="noTaxPrice">
|
||||
<el-input-number :controls=false controls-position="right" v-model="form.noTaxPrice" placeholder="请输入无税单价"
|
||||
:min="0" :max="form.taxPrice" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listOrderDetail, getOrderDetail, delOrderDetail, addOrderDetail, updateOrderDetail } from "@/api/wms/orderDetail";
|
||||
import { getOrder } from "@/api/wms/order";
|
||||
import ProductSelect from '@/components/Selector/ProductSelect';
|
||||
import { EOrderStatus } from "@/utils/enums";
|
||||
import ProductInfo from '@/components/Renderer/ProductInfo.vue';
|
||||
import BomInfoMini from '@/components/Renderer/BomInfoMini.vue';
|
||||
import KLPTable from '@/components/GearTable/index.vue';
|
||||
|
||||
export default {
|
||||
name: "OrderDetailPanel",
|
||||
dicts: ['order_status'],
|
||||
props: {
|
||||
orderId: {
|
||||
type: [String, Number],
|
||||
required: true
|
||||
}
|
||||
},
|
||||
components: {
|
||||
ProductSelect,
|
||||
ProductInfo,
|
||||
BomInfoMini,
|
||||
KLPTable
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
buttonLoading: false,
|
||||
loading: true,
|
||||
ids: [],
|
||||
single: true,
|
||||
multiple: true,
|
||||
total: 0,
|
||||
orderDetailList: [],
|
||||
orderInfo: null, // 订单信息
|
||||
title: "",
|
||||
open: false,
|
||||
// 订单状态枚举
|
||||
EOrderStatus,
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 100,
|
||||
orderId: this.orderId,
|
||||
productId: undefined,
|
||||
quantity: undefined,
|
||||
unit: undefined,
|
||||
},
|
||||
form: {
|
||||
orderId: this.orderId
|
||||
},
|
||||
rules: {
|
||||
orderId: [
|
||||
{ required: true, message: "订单ID不能为空", trigger: "blur" }
|
||||
],
|
||||
productId: [
|
||||
{ required: true, message: "产品ID不能为空", trigger: "blur" }
|
||||
],
|
||||
quantity: [
|
||||
{ required: true, message: "产品数量不能为空", trigger: "blur" },
|
||||
{ pattern: /^[1-9]\d*$/, message: "产品数量必须为正整数", trigger: "blur" }
|
||||
],
|
||||
unit: [
|
||||
{ required: true, message: "单位不能为空", trigger: "blur" }
|
||||
],
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
// 是否可以编辑（订单状态为新建时才能编辑）
|
||||
canEdit() {
|
||||
return this.orderInfo && this.orderInfo.orderStatus === EOrderStatus.NEW;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
orderId(newVal) {
|
||||
this.queryParams.orderId = newVal;
|
||||
this.form.orderId = newVal;
|
||||
this.getOrderInfo();
|
||||
this.getList();
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getOrderInfo();
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
// 获取订单信息
|
||||
getOrderInfo() {
|
||||
if (this.orderId) {
|
||||
getOrder(this.orderId).then(response => {
|
||||
this.orderInfo = response.data;
|
||||
}).catch(() => {
|
||||
this.orderInfo = null;
|
||||
});
|
||||
}
|
||||
},
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listOrderDetail(this.queryParams).then(response => {
|
||||
this.orderDetailList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
reset() {
|
||||
this.form = {
|
||||
detailId: undefined,
|
||||
orderId: this.orderId,
|
||||
productId: undefined,
|
||||
quantity: undefined,
|
||||
taxPrice: undefined,
|
||||
noTaxPrice: undefined,
|
||||
unit: undefined,
|
||||
remark: undefined,
|
||||
delFlag: undefined,
|
||||
createTime: undefined,
|
||||
createBy: undefined,
|
||||
updateTime: undefined,
|
||||
updateBy: undefined,
|
||||
};
|
||||
this.resetForm && this.resetForm("form");
|
||||
},
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.detailId)
|
||||
this.single = selection.length !== 1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
handleAdd() {
|
||||
if (!this.canEdit) {
|
||||
this.$modal && this.$modal.msgError("当前订单状态不允许新增明细");
|
||||
return;
|
||||
}
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加订单明细";
|
||||
},
|
||||
handleUpdate(row) {
|
||||
if (!this.canEdit) {
|
||||
this.$modal && this.$modal.msgError("当前订单状态不允许修改明细");
|
||||
return;
|
||||
}
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const detailId = row.detailId || this.ids
|
||||
getOrderDetail(detailId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改订单明细";
|
||||
});
|
||||
},
|
||||
onProductChange(product) {
|
||||
if (product) {
|
||||
this.form.unit = product.unit;
|
||||
} else {
|
||||
this.form.unit = undefined;
|
||||
}
|
||||
},
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.detailId != null) {
|
||||
updateOrderDetail(this.form).then(response => {
|
||||
this.$modal && this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addOrderDetail(this.form).then(response => {
|
||||
this.$modal && this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
handleDelete(row) {
|
||||
if (!this.canEdit) {
|
||||
this.$modal && this.$modal.msgError("当前订单状态不允许删除明细");
|
||||
return;
|
||||
}
|
||||
const detailIds = row.detailId || this.ids;
|
||||
this.$modal && this.$modal.confirm('是否确认删除订单明细编号为"' + detailIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delOrderDetail(detailIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal && this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
handleExport() {
|
||||
this.download && this.download('oa/orderDetail/export', {
|
||||
...this.queryParams
|
||||
}, `orderDetail_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.el-button--text {
|
||||
margin: 0 4px;
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
484
gear-ui3/src/views/oms/order/panels/orderPage.vue
Normal file
484
gear-ui3/src/views/oms/order/panels/orderPage.vue
Normal file
@@ -0,0 +1,484 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- 左右布局容器 -->
|
||||
<el-row :gutter="20">
|
||||
<!-- 左侧：使用klp-list组件（占6列） -->
|
||||
<el-col :span="6" style="display: table-cell;">
|
||||
<!-- 搜索表单 - 精简搜索项 -->
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"
|
||||
class="mb-4">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="16">
|
||||
<el-input v-model="queryParams.orderCode" placeholder="请输入订单编号" clearable
|
||||
@change="handleQuery" />
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
class="w-full">新增订单</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
|
||||
<!-- klp-list组件 -->
|
||||
<klp-list
|
||||
:list-data="orderList"
|
||||
:model-value="selectedIds"
|
||||
title-field="orderCode"
|
||||
list-key="orderId"
|
||||
title-label="订单编号"
|
||||
:loading="loading"
|
||||
@item-click="handleRowClick"
|
||||
>
|
||||
<!-- 自定义操作按钮 -->
|
||||
<template #actions="{ item }">
|
||||
<!-- 删除按钮 -->
|
||||
<el-button size="mini" type="text" style="color: red" icon="el-icon-delete" @click.stop="handleDelete(item)"></el-button>
|
||||
</template>
|
||||
</klp-list>
|
||||
|
||||
<!-- 分页组件 -->
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize" @pagination="getList" class="mt-4" />
|
||||
</el-col>
|
||||
|
||||
<!-- 右侧：详情区（占18列） -->
|
||||
<el-col :span="18">
|
||||
<div>
|
||||
<!-- 未选中行时显示提示 -->
|
||||
<div v-if="!selectedOrderId" class="empty-tip">
|
||||
<el-empty description="请从左侧选择一个订单查看详情" />
|
||||
</div>
|
||||
|
||||
<!-- 选中行时显示Tab详情 -->
|
||||
<div v-else>
|
||||
<!-- Tab容器 -->
|
||||
<el-tabs v-loading="loading" v-model="activeTab" type="border-card" class="mt-2">
|
||||
<!-- 订单信息Tab -->
|
||||
<el-tab-pane label="订单信息" name="orderInfo">
|
||||
<el-form ref="detailForm" :model="form" :rules="rules" label-width="80px" size="small" class="mt-4">
|
||||
<el-form-item label="订单ID" prop="orderId">
|
||||
<el-input style="width: 60%;" v-model="form.orderId" placeholder="无" disabled>
|
||||
<el-button style="padding: -1;" slot="append" size="mini" type="text" icon="el-icon-document-copy"
|
||||
@click.stop="copyOrderId(form.orderId)"></el-button>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="订单编号" prop="orderCode">
|
||||
<el-input style="width: 60%;" v-model="form.orderCode" placeholder="无" disabled />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="客户名称" prop="customerId">
|
||||
<customer-select style="width: 60%;" v-model="form.customerId" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="销售经理" prop="salesManager">
|
||||
<el-input style="width: 60%;" v-model="form.salesManager" placeholder="无" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="含税金额" prop="taxAmount">
|
||||
<el-input-number style="width: 60%;" :controls="false" v-model="form.taxAmount" placeholder="0.00" precision="2"
|
||||
:min="0" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="无税金额" prop="noTaxAmount">
|
||||
<el-input-number style="width: 60%;" :controls="false" v-model="form.noTaxAmount" placeholder="0.00" precision="2"
|
||||
:min="0" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="订单状态" prop="orderStatus">
|
||||
<el-select style="width: 60%;" v-model="form.orderStatus" @change="handleOrderStatusChange" size="mini">
|
||||
<el-option v-for="item in dict.type.order_status" :key="item.value" :label="item.label"
|
||||
:value="parseInt(item.value)" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input style="width: 60%;" v-model="form.remark" placeholder="无" type="textarea" rows="4" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 更新按钮 -->
|
||||
<el-form-item class="text-right">
|
||||
<el-button type="primary" size="mini" :loading="buttonLoading"
|
||||
@click="submitDetailForm">更新订单信息</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-tab-pane>
|
||||
|
||||
<!-- 订单详情Tab -->
|
||||
<el-tab-pane label="订单详情" name="orderDetail">
|
||||
<div class="mt-4">
|
||||
<OrderDetailPanel :orderId="selectedOrderId" />
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- 新增订单弹窗 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
|
||||
<el-form ref="addForm" :model="form" :rules="rules" label-width="100px">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="订单编号" prop="orderCode">
|
||||
<el-input v-model="form.orderCode" placeholder="请输入订单编号" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="客户名称" prop="customerId">
|
||||
<customer-select v-model="form.customerId" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="销售经理" prop="salesManager">
|
||||
<el-input v-model="form.salesManager" style="width: 100%;" placeholder="请输入销售经理" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="含税金额" prop="taxAmount">
|
||||
<el-input-number :controls="false" style="width: 100%;" v-model="form.taxAmount" placeholder="请输入含税金额" precision="2"
|
||||
:min="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="无税金额" prop="noTaxAmount">
|
||||
<el-input-number :controls="false" v-model="form.noTaxAmount" placeholder="请输入无税金额" precision="2"
|
||||
:min="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" type="textarea" rows="3" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitAddForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getOrder, delOrder, addOrder, updateOrder, listByStatus } from "@/api/wms/order";
|
||||
import OrderDetailPanel from './detail.vue';
|
||||
import { EOrderStatus } from "@/utils/enums";
|
||||
import CustomerSelect from '@/components/KLPService/CustomerSelect/index.vue';
|
||||
import klpList from "@/components/KLPUI/KLPList/index.vue";
|
||||
|
||||
export default {
|
||||
name: "Order",
|
||||
components: { OrderDetailPanel, CustomerSelect, klpList },
|
||||
dicts: ['order_status'],
|
||||
props: {
|
||||
tradeType: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
orderQueryStatus() {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 订单状态枚举
|
||||
EOrderStatus,
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 列表加载遮罩
|
||||
loading: true,
|
||||
// 选中的订单ID集合
|
||||
selectedIds: {},
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 订单列表数据
|
||||
orderList: [],
|
||||
// 新增弹窗标题
|
||||
title: "",
|
||||
// 新增弹窗显示状态
|
||||
open: false,
|
||||
// 当前选中的订单ID（控制右侧详情显示）
|
||||
selectedOrderId: null,
|
||||
// 右侧激活的Tab
|
||||
activeTab: "orderDetail",
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
orderCode: undefined,
|
||||
customerId: undefined,
|
||||
salesManager: undefined,
|
||||
orderStatus: undefined,
|
||||
tradeType: this.tradeType
|
||||
},
|
||||
// 表单参数
|
||||
form: {
|
||||
orderId: undefined,
|
||||
orderCode: undefined,
|
||||
customerId: undefined,
|
||||
salesManager: undefined,
|
||||
orderStatus: undefined,
|
||||
tradeType: this.tradeType,
|
||||
remark: undefined,
|
||||
delFlag: undefined,
|
||||
createTime: undefined,
|
||||
createBy: undefined,
|
||||
updateTime: undefined,
|
||||
updateBy: undefined,
|
||||
taxAmount: 0,
|
||||
noTaxAmount: 0,
|
||||
},
|
||||
// 表单校验规则
|
||||
rules: {
|
||||
orderCode: [
|
||||
{ required: true, message: "请输入订单编号", trigger: "blur" }
|
||||
],
|
||||
customerId: [
|
||||
{ required: true, message: "请选择客户名称", trigger: "change" }
|
||||
],
|
||||
salesManager: [
|
||||
{ required: true, message: "请输入销售经理", trigger: "blur" }
|
||||
],
|
||||
taxAmount: [
|
||||
{ required: true, message: "请输入含税金额", trigger: "blur" }
|
||||
],
|
||||
noTaxAmount: [
|
||||
{ required: true, message: "请输入无税金额", trigger: "blur" }
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.queryParams.orderStatus = this.orderQueryStatus;
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询订单列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listByStatus(this.queryParams).then(response => {
|
||||
this.orderList = response.rows;
|
||||
this.total = response.total;
|
||||
|
||||
// 重置选中状态
|
||||
this.selectedIds = {};
|
||||
|
||||
// 如果之前选中的订单不在列表中了，清空选中状态
|
||||
if (this.selectedOrderId && !this.orderList.some(item => item.orderId === this.selectedOrderId)) {
|
||||
this.selectedOrderId = null;
|
||||
}
|
||||
|
||||
this.loading = false;
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
|
||||
/** 点击列表项加载详情 */
|
||||
handleRowClick(item) {
|
||||
this.selectedOrderId = item.orderId;
|
||||
this.loadOrderDetail(item.orderId);
|
||||
},
|
||||
|
||||
/** 加载订单详情 */
|
||||
loadOrderDetail(orderId) {
|
||||
this.buttonLoading = true;
|
||||
getOrder(orderId).then(response => {
|
||||
this.form = { ...response.data };
|
||||
this.form.taxAmount = this.form.taxAmount || 0;
|
||||
this.form.noTaxAmount = this.form.noTaxAmount || 0;
|
||||
}).catch(() => {
|
||||
this.$modal.msgError("加载订单详情失败");
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
},
|
||||
|
||||
/** 订单状态变更 */
|
||||
handleOrderStatusChange() {
|
||||
updateOrder(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.getList();
|
||||
}).catch(() => {
|
||||
this.$modal.msgError("修改失败");
|
||||
this.loadOrderDetail(this.selectedOrderId); // 失败后重新加载原数据
|
||||
});
|
||||
},
|
||||
|
||||
/** 取消新增 */
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.resetForm("addForm");
|
||||
this.form = {
|
||||
orderId: undefined,
|
||||
orderCode: undefined,
|
||||
customerId: undefined,
|
||||
salesManager: undefined,
|
||||
orderStatus: this.orderQueryStatus,
|
||||
tradeType: this.tradeType,
|
||||
remark: undefined,
|
||||
taxAmount: 0,
|
||||
noTaxAmount: 0,
|
||||
};
|
||||
},
|
||||
|
||||
/** 搜索 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
|
||||
/** 重置搜索 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.queryParams.orderStatus = this.orderQueryStatus;
|
||||
this.handleQuery();
|
||||
},
|
||||
|
||||
/** 重置表单 */
|
||||
resetForm(formRef) {
|
||||
if (this.$refs[formRef]) {
|
||||
this.$refs[formRef].resetFields();
|
||||
}
|
||||
},
|
||||
|
||||
/** 复制订单ID */
|
||||
copyOrderId(orderId) {
|
||||
if (navigator.clipboard) {
|
||||
navigator.clipboard.writeText(orderId).then(() => {
|
||||
this.$modal.msgSuccess("复制成功");
|
||||
}).catch(() => {
|
||||
this.$modal.msgError("复制失败，请手动复制");
|
||||
});
|
||||
} else {
|
||||
this.$modal.msgError("浏览器不支持复制功能");
|
||||
}
|
||||
},
|
||||
|
||||
/** 新增订单 */
|
||||
handleAdd() {
|
||||
this.resetForm("addForm");
|
||||
this.form = {
|
||||
orderId: undefined,
|
||||
orderCode: undefined,
|
||||
customerId: undefined,
|
||||
salesManager: undefined,
|
||||
orderStatus: this.orderQueryStatus,
|
||||
remark: undefined,
|
||||
taxAmount: 0,
|
||||
noTaxAmount: 0,
|
||||
};
|
||||
this.open = true;
|
||||
this.title = "添加订单";
|
||||
},
|
||||
|
||||
/** 提交新增表单 */
|
||||
submitAddForm() {
|
||||
this.$refs["addForm"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
addOrder(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).catch(() => {
|
||||
this.$modal.msgError("新增失败");
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
/** 提交详情更新表单 */
|
||||
submitDetailForm() {
|
||||
this.$refs["detailForm"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
updateOrder(this.form).then(response => {
|
||||
this.$modal.msgSuccess("更新成功");
|
||||
this.getList();
|
||||
}).catch(() => {
|
||||
this.$modal.msgError("更新失败");
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
/** 删除订单 */
|
||||
handleDelete(row) {
|
||||
this.$modal.confirm(`是否确认删除订单"${row.orderCode}"？`).then(() => {
|
||||
this.loading = true;
|
||||
return delOrder([row.orderId]);
|
||||
}).then(() => {
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
// 如果删除的是当前选中的订单，清空详情
|
||||
if (this.selectedOrderId === row.orderId) {
|
||||
this.selectedOrderId = null;
|
||||
}
|
||||
this.getList();
|
||||
}).catch(() => {
|
||||
this.$modal.msgError("删除失败");
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
|
||||
/** 预订单确认 */
|
||||
handleStartProduction(row) {
|
||||
this.$modal.confirm(`是否确认将订单"${row.orderCode}"转为正式订单？`).then(() => {
|
||||
return updateOrder({
|
||||
orderId: row.orderId,
|
||||
orderStatus: 1
|
||||
});
|
||||
}).then(response => {
|
||||
this.$modal.msgSuccess("已转化为正式订单");
|
||||
if (this.selectedOrderId === row.orderId) {
|
||||
this.selectedOrderId = null;
|
||||
}
|
||||
this.getList();
|
||||
}).catch(() => {
|
||||
this.$modal.msgError("转化失败");
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 页面容器样式 */
|
||||
.page-container {
|
||||
height: 100%;
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
/* 空提示样式 */
|
||||
.empty-tip {
|
||||
height: 400px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* 表单样式调整 */
|
||||
.el-form-item {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
::v-deep .el-input-group__append,
|
||||
::v-deep .el-input-group__prepend {
|
||||
width: 20px !important;
|
||||
box-sizing: border-box !important;
|
||||
padding: 0 10px !important;
|
||||
text-align: center !important;
|
||||
}
|
||||
</style>
|
||||
16
gear-ui3/src/views/oms/order/trade.vue
Normal file
16
gear-ui3/src/views/oms/order/trade.vue
Normal file
@@ -0,0 +1,16 @@
|
||||
<template>
|
||||
<div>
|
||||
<OrderPage :isPre="false" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import OrderPage from './panels/orderPage.vue';
|
||||
|
||||
export default {
|
||||
name: 'Order',
|
||||
components: {
|
||||
OrderPage
|
||||
}
|
||||
}
|
||||
</script>
|
||||
373
gear-ui3/src/views/oms/pay/index.vue
Normal file
373
gear-ui3/src/views/oms/pay/index.vue
Normal file
@@ -0,0 +1,373 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="供应商" prop="supplierId">
|
||||
<VendorSelect v-model="queryParams.supplierId" />
|
||||
</el-form-item>
|
||||
<el-form-item label="订单编号" prop="orderCode">
|
||||
<el-input
|
||||
v-model="queryParams.orderCode"
|
||||
placeholder="请输入订单ID"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="到期日" prop="dueDate">
|
||||
<el-date-picker clearable
|
||||
v-model="queryParams.dueDate"
|
||||
type="date"
|
||||
value-format="yyyy-MM-dd"
|
||||
placeholder="请选择到期日">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="payableList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="应付ID" align="center" prop="payableId" v-if="false"/>
|
||||
<el-table-column label="供应商" align="center" prop="supplierName" />
|
||||
<el-table-column label="订单ID" align="center" prop="orderId" />
|
||||
<el-table-column label="到期日" align="center" prop="dueDate" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.dueDate, '{y}-{m}-{d}') }}</span>
|
||||
<el-tag v-if="new Date(scope.row.dueDate) < new Date()" type="danger">过期</el-tag>
|
||||
<el-tag v-else-if="new Date(scope.row.dueDate) > new Date()" type="success">还剩{{ parseInt((new Date(scope.row.dueDate) - new Date()) / (1000 * 60 * 60 * 24)) }}天</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="应付金额" align="center" prop="amount" />
|
||||
<el-table-column label="已付金额" align="center" prop="paidAmount" />
|
||||
<el-table-column label="未付金额" align="center" prop="balanceAmount" />
|
||||
<el-table-column label="状态" align="center" prop="status" />
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-money"
|
||||
@click="handlePay(scope.row)"
|
||||
>付款</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改应付款管理（宽松版）对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="供应商ID" prop="supplierId">
|
||||
<VendorSelect v-model="form.supplierId" />
|
||||
</el-form-item>
|
||||
<el-form-item label="订单ID" prop="orderId">
|
||||
<el-input v-model="form.orderId" placeholder="请输入订单ID" />
|
||||
</el-form-item>
|
||||
<el-form-item label="到期日" prop="dueDate">
|
||||
<el-date-picker clearable
|
||||
v-model="form.dueDate"
|
||||
type="datetime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
placeholder="请选择到期日">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="应付金额" prop="amount">
|
||||
<el-input v-model="form.amount" placeholder="请输入应付金额" />
|
||||
</el-form-item>
|
||||
<el-form-item label="已付金额" prop="paidAmount">
|
||||
<el-input v-model="form.paidAmount" disabled placeholder="请输入已付金额" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="未付金额" prop="balanceAmount">
|
||||
<el-input v-model="form.balanceAmount" placeholder="请输入未付金额" />
|
||||
</el-form-item> -->
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog title="付款" :visible.sync="payOpen" width="500px" append-to-body>
|
||||
<el-form ref="payForm" :model="payForm" :rules="rules" label-width="80px">
|
||||
<el-form-item label="付款金额" prop="amount">
|
||||
<el-input-number :controls=false controls-position="right" v-model="payForm.amount" :step="1.00" :precision="2" placeholder="请输入付款金额" :min="0" :max="payForm.balanceAmount" style="width: 100%;"/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitPayForm">确 定</el-button>
|
||||
<el-button @click="cancelPay">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listPayable, getPayable, delPayable, addPayable, updatePayable, updatePaidAmount } from "@/api/finance/payable";
|
||||
import VendorSelect from '@/components/KLPService/VendorSelect/index.vue';
|
||||
|
||||
export default {
|
||||
name: "Payable",
|
||||
components: {
|
||||
VendorSelect
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 应付款管理（宽松版）表格数据
|
||||
payableList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
supplierId: undefined,
|
||||
orderCode: undefined,
|
||||
dueDate: undefined,
|
||||
amount: undefined,
|
||||
paidAmount: undefined,
|
||||
balanceAmount: undefined,
|
||||
status: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
},
|
||||
// 付款表单参数
|
||||
payForm: {},
|
||||
// 是否显示付款弹出层
|
||||
payOpen: false
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询应付款管理（宽松版）列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listPayable(this.queryParams).then(response => {
|
||||
this.payableList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
payableId: undefined,
|
||||
supplierId: undefined,
|
||||
orderId: undefined,
|
||||
dueDate: undefined,
|
||||
amount: undefined,
|
||||
paidAmount: 0,
|
||||
balanceAmount: undefined,
|
||||
status: undefined,
|
||||
delFlag: undefined,
|
||||
remark: undefined,
|
||||
createTime: undefined,
|
||||
createBy: undefined,
|
||||
updateTime: undefined,
|
||||
updateBy: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.payableId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加应付款管理（宽松版）";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const payableId = row.payableId || this.ids
|
||||
getPayable(payableId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改应付款管理（宽松版）";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.payableId != null) {
|
||||
const {balanceAmount, ...payload} = this.form;
|
||||
updatePayable(payload).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addPayable(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const payableIds = row.payableId || this.ids;
|
||||
this.$modal.confirm('是否确认删除应付款管理（宽松版）编号为"' + payableIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delPayable(payableIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('klp/payable/export', {
|
||||
...this.queryParams
|
||||
}, `payable_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
// 付款按钮操作
|
||||
handlePay(row) {
|
||||
this.payForm = {
|
||||
payableId: row.payableId,
|
||||
amount: row.balanceAmount,
|
||||
balanceAmount: row.balanceAmount
|
||||
};
|
||||
this.payOpen = true;
|
||||
},
|
||||
// 取消付款按钮操作
|
||||
cancelPay() {
|
||||
this.payOpen = false;
|
||||
this.payForm = {};
|
||||
},
|
||||
submitPayForm() {
|
||||
const payload = {
|
||||
payableId: this.payForm.payableId,
|
||||
paidAmount: this.payForm.amount
|
||||
}
|
||||
this.buttonLoading = true;
|
||||
updatePaidAmount(payload).then(response => {
|
||||
this.$modal.msgSuccess("付款成功");
|
||||
this.payOpen = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
373
gear-ui3/src/views/oms/receive/index.vue
Normal file
373
gear-ui3/src/views/oms/receive/index.vue
Normal file
@@ -0,0 +1,373 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="客户名称" prop="customerId">
|
||||
<CustomerSelect v-model="queryParams.customerId" />
|
||||
</el-form-item>
|
||||
<el-form-item label="订单ID" prop="orderCode">
|
||||
<el-input
|
||||
v-model="queryParams.orderCode"
|
||||
placeholder="请输入订单ID"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="到期日" prop="dueDate">
|
||||
<el-date-picker clearable
|
||||
v-model="queryParams.dueDate"
|
||||
type="date"
|
||||
value-format="yyyy-MM-dd"
|
||||
placeholder="请选择到期日">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="receivableList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="应收ID" align="center" prop="receivableId" v-if="false"/>
|
||||
<el-table-column label="客户" align="center" prop="customerName" />
|
||||
<el-table-column label="订单ID" align="center" prop="orderId" />
|
||||
<el-table-column label="到期日" align="center" prop="dueDate" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.dueDate, '{y}-{m}-{d}') }}</span>
|
||||
<el-tag v-if="new Date(scope.row.dueDate) < new Date()" type="danger">过期</el-tag>
|
||||
<el-tag v-else-if="new Date(scope.row.dueDate) > new Date()" type="success">还剩{{ parseInt((new Date(scope.row.dueDate) - new Date()) / (1000 * 60 * 60 * 24)) }}天</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="应收金额" align="center" prop="amount" />
|
||||
<el-table-column label="已收金额" align="center" prop="paidAmount" />
|
||||
<el-table-column label="未收金额" align="center" prop="balanceAmount" />
|
||||
<el-table-column label="状态" align="center" prop="status" />
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-money"
|
||||
@click="handleReceive(scope.row)"
|
||||
>收款</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改应收款管理（宽松版）对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="客户ID" prop="customerId">
|
||||
<CustomerSelect v-model="form.customerId" />
|
||||
</el-form-item>
|
||||
<el-form-item label="订单ID" prop="orderId">
|
||||
<el-input v-model="form.orderId" placeholder="请输入订单ID" />
|
||||
</el-form-item>
|
||||
<el-form-item label="到期日" prop="dueDate">
|
||||
<el-date-picker clearable
|
||||
v-model="form.dueDate"
|
||||
type="datetime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
placeholder="请选择到期日">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="应收金额" prop="amount">
|
||||
<el-input v-model="form.amount" placeholder="请输入应收金额" />
|
||||
</el-form-item>
|
||||
<el-form-item label="已收金额" prop="paidAmount">
|
||||
<el-input v-model="form.paidAmount" disabled placeholder="请输入已收金额" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="未收金额" prop="balanceAmount">
|
||||
<el-input v-model="form.balanceAmount" placeholder="请输入未收金额" />
|
||||
</el-form-item> -->
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog title="收款" :visible.sync="receiveOpen" width="500px" append-to-body>
|
||||
<el-form ref="receiveForm" :model="receiveForm" :rules="rules" label-width="80px">
|
||||
<el-form-item label="收款金额" prop="amount">
|
||||
<el-input-number :controls=false controls-position="right" v-model="receiveForm.amount" :step="1.00" :precision="2" placeholder="请输入收款金额" :min="0" :max="receiveForm.balanceAmount" style="width: 100%;"/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitReceiveForm">确 定</el-button>
|
||||
<el-button @click="cancelReceive">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listReceivable, getReceivable, delReceivable, addReceivable, updateReceivable, updatePaidAmount } from "@/api/finance/receivable";
|
||||
import CustomerSelect from '@/components/KLPService/CustomerSelect/index.vue';
|
||||
|
||||
export default {
|
||||
name: "Receivable",
|
||||
components: {
|
||||
CustomerSelect
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 应收款管理（宽松版）表格数据
|
||||
receivableList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
customerId: undefined,
|
||||
orderCode: undefined,
|
||||
dueDate: undefined,
|
||||
amount: undefined,
|
||||
paidAmount: undefined,
|
||||
balanceAmount: undefined,
|
||||
status: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
},
|
||||
// 收款表单参数
|
||||
receiveForm: {},
|
||||
// 是否显示收款弹出层
|
||||
receiveOpen: false
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询应收款管理（宽松版）列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listReceivable(this.queryParams).then(response => {
|
||||
this.receivableList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
receivableId: undefined,
|
||||
customerId: undefined,
|
||||
orderId: undefined,
|
||||
dueDate: undefined,
|
||||
amount: undefined,
|
||||
paidAmount: 0,
|
||||
balanceAmount: undefined,
|
||||
status: undefined,
|
||||
delFlag: undefined,
|
||||
remark: undefined,
|
||||
createTime: undefined,
|
||||
createBy: undefined,
|
||||
updateTime: undefined,
|
||||
updateBy: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.receivableId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加应收款管理（宽松版）";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const receivableId = row.receivableId || this.ids
|
||||
getReceivable(receivableId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改应收款管理（宽松版）";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.receivableId != null) {
|
||||
const {balanceAmount, ...payload} = this.form;
|
||||
updateReceivable(payload).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addReceivable(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const receivableIds = row.receivableId || this.ids;
|
||||
this.$modal.confirm('是否确认删除应收款管理（宽松版）编号为"' + receivableIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delReceivable(receivableIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('klp/receivable/export', {
|
||||
...this.queryParams
|
||||
}, `receivable_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
// 收款按钮操作
|
||||
handleReceive(row) {
|
||||
this.receiveForm = {
|
||||
receivableId: row.receivableId,
|
||||
amount: row.balanceAmount,
|
||||
balanceAmount: row.balanceAmount
|
||||
};
|
||||
this.receiveOpen = true;
|
||||
},
|
||||
// 取消收款按钮操作
|
||||
cancelReceive() {
|
||||
this.receiveOpen = false;
|
||||
this.receiveForm = {};
|
||||
},
|
||||
submitReceiveForm() {
|
||||
const payload = {
|
||||
receivableId: this.receiveForm.receivableId,
|
||||
paidAmount: this.receiveForm.amount
|
||||
}
|
||||
this.buttonLoading = true;
|
||||
updatePaidAmount(payload).then(response => {
|
||||
this.$modal.msgSuccess("收款成功");
|
||||
this.receiveOpen = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -58,12 +58,6 @@
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="Edit" @click="handleUpdate(scope.row)">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="Delete" @click="handleDelete(scope.row)">删除</el-button>
|
||||
<!-- <el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-document"
|
||||
@click="goLedger(scope.row)"
|
||||
>台账</el-button> -->
|
||||
<el-button size="mini" type="text" icon="Document"
|
||||
@click="handleInstallManual(scope.row)">安装说明书</el-button>
|
||||
<el-button size="mini" type="text" icon="DataAnalysis" @click="handleBom(scope.row)">BOM</el-button>
|
||||
@@ -83,6 +77,9 @@
|
||||
<el-form-item label="产品名称" prop="productName">
|
||||
<el-input v-model="form.productName" placeholder="请输入产品名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="产品分类" prop="categoryId">
|
||||
<el-input v-model="form.categoryId" placeholder="请输入产品分类" />
|
||||
</el-form-item>
|
||||
<el-form-item label="负责人" prop="owner">
|
||||
<el-input v-model="form.owner" :multiple="false" placeholder="请填写负责人" />
|
||||
</el-form-item>
|
||||
|
||||
@@ -115,7 +115,7 @@
|
||||
</el-form-item>
|
||||
<el-form-item label="供应商" prop="supplierId">
|
||||
<el-select v-model="form.supplierId" filterable clearable placeholder="请选择供应商">
|
||||
<el-option
|
||||
<el-option
|
||||
v-for="value in supplierList"
|
||||
:value="value.supplierId"
|
||||
:label="value.name"
|
||||
|
||||
Reference in New Issue
Block a user