emis-service/gentools/code/tnemis-mgnt/preview/emis/emisSiteAccount/emisSiteAccount_vue_preview.html
2024-03-07 18:49:59 +08:00

652 lines
24 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<style>
.app-container{
padding: 20px;
background-color: #fff;
min-height: 600px;
}
</style>
</head>
<body>
<div id="app">
<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="accCode">
<el-input
v-model="queryParams.accCode"
placeholder="账户编号"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="siteNameCode">
<el-input
v-model="queryParams.siteNameCode"
placeholder="站点名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="siteName">
<el-input
v-model="queryParams.siteName"
placeholder="站点代码"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="centerName">
<el-input
v-model="queryParams.centerName"
placeholder="财务中心名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="centerNameCode">
<el-input
v-model="queryParams.centerNameCode"
placeholder="财务中心代码"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="curMoney">
<el-input
v-model="queryParams.curMoney"
placeholder="当前余额"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="frozenMoney">
<el-input
v-model="queryParams.frozenMoney"
placeholder="冻结余额"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="confirmMoney">
<el-input
v-model="queryParams.confirmMoney"
placeholder="确认金额"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="watchMoney">
<el-input
v-model="queryParams.watchMoney"
placeholder="警戒余额"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="closeMoney">
<el-input
v-model="queryParams.closeMoney"
placeholder="关闭金额"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="earnestMoney">
<el-input
v-model="queryParams.earnestMoney"
placeholder="保证金"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="currency">
<el-input
v-model="queryParams.currency"
placeholder="币种"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="startDate">
<el-input
v-model="queryParams.startDate"
placeholder="开户日期"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="blOpen">
<el-input
v-model="queryParams.blOpen"
placeholder="是否启用"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="blLock">
<el-input
v-model="queryParams.blLock"
placeholder="是否锁定"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="blClear">
<el-input
v-model="queryParams.blClear"
placeholder="是否清理"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="clearSiteCode">
<el-input
v-model="queryParams.clearSiteCode"
placeholder="清理站点代码"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="clearDate">
<el-input
v-model="queryParams.clearDate"
placeholder="清理日期"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="clearManCode">
<el-input
v-model="queryParams.clearManCode"
placeholder="清理人编号"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="createSiteCode">
<el-input
v-model="queryParams.createSiteCode"
placeholder="创建站点代码"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="modifySiteCode">
<el-input
v-model="queryParams.modifySiteCode"
placeholder="修改站点代码"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="remark">
<el-input
v-model="queryParams.remark"
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="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
>删除</el-button>
</el-col>
</el-row>
<el-table v-loading="loading" :data="emisSiteAccountList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" ></el-table-column>
<el-table-column label="序号" align="center" min-width="60">
<template slot-scope="scope">
<span v-text="getIndex(scope.$index)"> </span>
</template>
</el-table-column>
<el-table-column label="账户编号" align="center" prop="accCode" width="100px"> </el-table-column>
<el-table-column label="站点名称" align="center" prop="siteNameCode" width="100px"> </el-table-column>
<el-table-column label="站点代码" align="center" prop="siteName" width="100px"> </el-table-column>
<el-table-column label="财务中心名称" align="center" prop="centerName" width="100px"> </el-table-column>
<el-table-column label="财务中心代码" align="center" prop="centerNameCode" width="100px"> </el-table-column>
<el-table-column label="当前余额" align="center" prop="curMoney" width="100px"> </el-table-column>
<el-table-column label="冻结余额" align="center" prop="frozenMoney" width="100px"> </el-table-column>
<el-table-column label="确认金额" align="center" prop="confirmMoney" width="100px"> </el-table-column>
<el-table-column label="警戒余额" align="center" prop="watchMoney" width="100px"> </el-table-column>
<el-table-column label="关闭金额" align="center" prop="closeMoney" width="100px"> </el-table-column>
<el-table-column label="保证金" align="center" prop="earnestMoney" width="100px"> </el-table-column>
<el-table-column label="币种" align="center" prop="currency" width="100px"> </el-table-column>
<el-table-column label="开户日期" align="center" prop="startDate" width="100px"> </el-table-column>
<el-table-column label="是否启用" align="center" prop="blOpen" width="100px"> </el-table-column>
<el-table-column label="是否锁定" align="center" prop="blLock" width="100px"> </el-table-column>
<el-table-column label="是否清理" align="center" prop="blClear" width="100px"> </el-table-column>
<el-table-column label="清理站点代码" align="center" prop="clearSiteCode" width="100px"> </el-table-column>
<el-table-column label="清理日期" align="center" prop="clearDate" width="100px"> </el-table-column>
<el-table-column label="清理人编号" align="center" prop="clearManCode" width="100px"> </el-table-column>
<el-table-column label="创建站点代码" align="center" prop="createSiteCode" width="100px"> </el-table-column>
<el-table-column label="修改站点代码" align="center" prop="modifySiteCode" width="100px"> </el-table-column>
<el-table-column label="备注" align="center" prop="remark" width="100px"> </el-table-column>
<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>
</template>
</el-table-column>
</el-table>
<!-- 添加或修改网点结算账户对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" :close-on-click-modal="false" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-row>
<el-col :span="6">
</el-col>
<el-col :span="6">
</el-col>
<el-col :span="6">
</el-col>
<el-col :span="6">
</el-col>
</el-row>
<el-form-item label="账户编号" prop="accCode">
<el-input v-model="form.accCode" placeholder="请输入账户编号" />
</el-form-item>
<el-form-item label="站点名称" prop="siteNameCode">
<el-input v-model="form.siteNameCode" placeholder="请输入站点名称" />
</el-form-item>
<el-form-item label="站点代码" prop="siteName">
<el-input v-model="form.siteName" placeholder="请输入站点代码" />
</el-form-item>
<el-form-item label="财务中心名称" prop="centerName">
<el-input v-model="form.centerName" placeholder="请输入财务中心名称" />
</el-form-item>
<el-form-item label="财务中心代码" prop="centerNameCode">
<el-input v-model="form.centerNameCode" placeholder="请输入财务中心代码" />
</el-form-item>
<el-form-item label="当前余额" prop="curMoney">
<el-input v-model="form.curMoney" placeholder="请输入当前余额" />
</el-form-item>
<el-form-item label="冻结余额" prop="frozenMoney">
<el-input v-model="form.frozenMoney" placeholder="请输入冻结余额" />
</el-form-item>
<el-form-item label="确认金额" prop="confirmMoney">
<el-input v-model="form.confirmMoney" placeholder="请输入确认金额" />
</el-form-item>
<el-form-item label="警戒余额" prop="watchMoney">
<el-input v-model="form.watchMoney" placeholder="请输入警戒余额" />
</el-form-item>
<el-form-item label="关闭金额" prop="closeMoney">
<el-input v-model="form.closeMoney" placeholder="请输入关闭金额" />
</el-form-item>
<el-form-item label="保证金" prop="earnestMoney">
<el-input v-model="form.earnestMoney" placeholder="请输入保证金" />
</el-form-item>
<el-form-item label="币种" prop="currency">
<el-input v-model="form.currency" placeholder="请输入币种" />
</el-form-item>
<el-form-item label="开户日期" prop="startDate">
<el-input v-model="form.startDate" placeholder="请输入开户日期" />
</el-form-item>
<el-form-item label="是否启用" prop="blOpen">
<el-input v-model="form.blOpen" placeholder="请输入是否启用" />
</el-form-item>
<el-form-item label="是否锁定" prop="blLock">
<el-input v-model="form.blLock" placeholder="请输入是否锁定" />
</el-form-item>
<el-form-item label="是否清理" prop="blClear">
<el-input v-model="form.blClear" placeholder="请输入是否清理" />
</el-form-item>
<el-form-item label="清理站点代码" prop="clearSiteCode">
<el-input v-model="form.clearSiteCode" placeholder="请输入清理站点代码" />
</el-form-item>
<el-form-item label="清理日期" prop="clearDate">
<el-input v-model="form.clearDate" placeholder="请输入清理日期" />
</el-form-item>
<el-form-item label="清理人编号" prop="clearManCode">
<el-input v-model="form.clearManCode" placeholder="请输入清理人编号" />
</el-form-item>
<el-form-item label="创建站点代码" prop="createSiteCode">
<el-input v-model="form.createSiteCode" placeholder="请输入创建站点代码" />
</el-form-item>
<el-form-item label="修改站点代码" prop="modifySiteCode">
<el-input v-model="form.modifySiteCode" 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 type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</div>
<script>
new Vue({
el: '#app',
data:{
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 创建时间搜索
dateTimeRange:[],
// 搜索下拉
// itemOptions:[],
// 下拉枚举
demoOptions: [
{value: '1', label: '下拉1'},
{value: '2', label: '下拉2'},
],
// 总条数
total: 0,
// 网点结算账户表格数据
emisSiteAccountList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 弹出展示层
id:null,
titleView:"",
openView: false,
// 备注时间范围
daterangeCreateTime: [],
// 备注时间范围
daterangeUpdateTime: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 20,
accCode: null,
siteNameCode: null,
siteName: null,
centerName: null,
centerNameCode: null,
curMoney: null,
frozenMoney: null,
confirmMoney: null,
watchMoney: null,
closeMoney: null,
earnestMoney: null,
currency: null,
startDate: null,
blOpen: null,
blLock: null,
blClear: null,
clearSiteCode: null,
clearDate: null,
clearManCode: null,
createSiteCode: null,
modifySiteCode: null,
remark: null
},
// 表单参数
form: {},
// 表单校验
rules: {
id: [
{ required: true, message: "id不能为空", trigger: "blur" }
],
}
},
created() {
this.getList();
},
methods: {
/** 查询网点结算账户列表 */
getList() {
this.loading = true;
this.emisSiteAccountList=[];
let dataNew = {};
dataNew.accCode = "DEMO文字展示,DEMO文字展示";
dataNew.siteNameCode = "DEMO文字展示,DEMO文字展示";
dataNew.siteName = "DEMO文字展示,DEMO文字展示";
dataNew.centerName = "DEMO文字展示,DEMO文字展示";
dataNew.centerNameCode = "DEMO文字展示,DEMO文字展示";
dataNew.curMoney = "DEMO文字展示,DEMO文字展示";
dataNew.frozenMoney = "DEMO文字展示,DEMO文字展示";
dataNew.confirmMoney = "DEMO文字展示,DEMO文字展示";
dataNew.watchMoney = "DEMO文字展示,DEMO文字展示";
dataNew.closeMoney = "DEMO文字展示,DEMO文字展示";
dataNew.earnestMoney = "DEMO文字展示,DEMO文字展示";
dataNew.currency = "DEMO文字展示,DEMO文字展示";
dataNew.startDate = "DEMO文字展示,DEMO文字展示";
dataNew.blOpen = "DEMO文字展示,DEMO文字展示";
dataNew.blLock = "DEMO文字展示,DEMO文字展示";
dataNew.blClear = "DEMO文字展示,DEMO文字展示";
dataNew.clearSiteCode = "DEMO文字展示,DEMO文字展示";
dataNew.clearDate = "DEMO文字展示,DEMO文字展示";
dataNew.clearManCode = "DEMO文字展示,DEMO文字展示";
dataNew.createSiteCode = "DEMO文字展示,DEMO文字展示";
dataNew.modifySiteCode = "DEMO文字展示,DEMO文字展示";
dataNew.remark = "DEMO文字展示,DEMO文字展示";
this.emisSiteAccountList.push(dataNew);
this.loading = false;
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
accCode: null,
siteNameCode: null,
siteName: null,
centerName: null,
centerNameCode: null,
curMoney: null,
frozenMoney: null,
confirmMoney: null,
watchMoney: null,
closeMoney: null,
earnestMoney: null,
currency: null,
startDate: null,
blOpen: null,
blLock: null,
blClear: null,
clearSiteCode: null,
clearDate: null,
clearManCode: null,
createSiteCode: null,
modifySiteCode: null,
delFlag: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
remark: null
};
this.resetForm("form");
},
resetForm(obj){
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "新增";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids
getEmisSiteAccount(id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改";
});
},
handleView(row) {
this.id=row.id;
this.titleView="查看";
this.openView=true;
// this.router.push({ path: '/emis/emisSiteAccount/viewDetail', query: { id: row.id }})
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
updateEmisSiteAccount(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addEmisSiteAccount(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal.confirm('是否确认删除').then(function() {
return delEmisSiteAccount(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
// this.download('emis/emisSiteAccount/export', {
// ...this.queryParams
// }, `emisSiteAccount_${new Date().getTime()}.xlsx`)
const loadingInstance = this.$loading({
text: '正在导出...'
})
var qParam = {...this.queryParams};
qParam.pageNum=1;
qParam.pageSize=5000;
listEmisSiteAccount(this.addDateRange(qParam, this.dateTimeRange)).then(response => {
this.downloadLoading = false
if (response.code === 200) {
const curList = response.rows
import('@/vendor/Export2Excel').then(excel => {
const tHeader = ['id','账户编号','站点名称','站点代码','财务中心名称','财务中心代码','当前余额','冻结余额','确认金额','警戒余额','关闭金额','保证金','币种','开户日期','是否启用','是否锁定','是否清理','清理站点代码','清理日期','清理人编号','创建站点代码','修改站点代码','删除标志(0代表存在','创建者','创建时间','更新者','更新时间','备注',];
const filterVal = ['id','accCode','siteNameCode','siteName','centerName','centerNameCode','curMoney','frozenMoney','confirmMoney','watchMoney','closeMoney','earnestMoney','currency','startDate','blOpen','blLock','blClear','clearSiteCode','clearDate','clearManCode','createSiteCode','modifySiteCode','delFlag','createBy','createTime','updateBy','updateTime','remark',];
const data = this.formatJson(filterVal, curList, response.rows)
excel.export_json_to_excel({
header: tHeader,
data,
filename: '网点结算账户',
autoWidth: true
})
loadingInstance.close()
})
}
});
},
formatJson(filterVal, jsonData, resData) {
let index = 0
return jsonData.map(v => filterVal.map(j => {
if (j === 'index') {
return ++index
}
if (j === 'status') {
var statusStr='xxx'
if(v[j] == 10){
statusStr='xxx'
}
return statusStr;
}
return v[j]
}))
},
/** 列索引函数 */
getIndex($index) {
return (this.queryParams.pageNum - 1) * this.queryParams.pageSize + $index + 1
},
/** 时间搜索响应函数 */
dateTimeChange(value){
this.dateTimeRange=value;
},
}
})
</script>
</body>
</html>