web-base-admin/src/views/information/business/index.vue

834 lines
23 KiB
Vue
Raw Normal View History

2025-03-23 09:18:42 +08:00
<template>
<div class="page1">
<topBar
v-if="topList.length > 0"
:topList="topList"
:moren="moren"
></topBar>
<div class="thetopbox">
<el-form ref="form" :model="queryParams" label-width="100px">
<el-row>
<el-col :span="4">
<el-form-item :label="$t('MN_T_1')" prop="memberCode">
<el-input clearable v-model="queryParams.memberCode"></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item :label="$t('CK_KS_14')" prop="name">
<el-input clearable v-model="queryParams.memberName"></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item :label="$t('CK_KS_15')" prop="pkRegisterGrade">
<el-select
clearable
:placeholder="$t('CK_KS_38')"
v-model="queryParams.pkRegisterGrade"
>
<el-option
v-for="item in gradeRangList"
:key="item.pkId"
:label="item.gradeName"
:value="item.pkId"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item :label="$t('CK_KS_16')" prop="pkAwards">
<el-select
clearable
:placeholder="$t('CK_KS_38')"
v-model="queryParams.pkAwards"
>
<el-option
v-for="item in awardsList"
:key="item.pkId"
:label="item.awardsName"
:value="item.pkId"
></el-option>
</el-select>
<!-- <el-input clearable v-model="queryParams.pkAwards"></el-input> -->
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item :label="$t('MN_F_T_829')" prop="vertexId">
<el-select
clearable
:placeholder="$t('CK_KS_38')"
v-model="queryParams.vertexId"
>
<el-option
v-for="item in vertexList"
:key="item.pkId"
:label="item.vertexName"
:value="item.pkId"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item :label="$t('MN_F_T_122')" prop="teamId">
<el-select
clearable
:placeholder="$t('CK_KS_38')"
v-model="queryParams.teamId"
>
<el-option
v-for="item in memberTeamList"
:key="item.pkId"
:label="item.teamName"
:value="item.pkId"
></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="4">
<el-form-item :label="$t('MN_F_T_833')" prop="code">
<el-input clearable v-model="queryParams.editNumber"></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item :label="$t('w_0052')" prop="code">
<el-input clearable v-model="queryParams.phone"></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item :label="$t('MN_F_T_825')" prop="centerMemberCode">
<el-input
clearable
v-model="queryParams.centerMemberCode"
></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item :label="$t('MN_F_T_826')" prop="centerMemberName">
<el-input
clearable
v-model="queryParams.centerMemberName"
></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="$t('PER_DA_9')" prop="code">
<el-date-picker
v-model="queryParams.time1"
@change="changeTime1"
type="datetimerange"
range-separator="——"
:start-placeholder="$t('CK_KS_4')"
:end-placeholder="$t('CK_KS_5')"
value-format="yyyy-MM-dd HH:mm:ss"
:unlink-panels="true"
>
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-collapse-transition>
<div v-show="isActive">
<el-row>
<el-col :span="8">
<el-form-item :label="$t('MN_F_T_914')" prop="code">
<el-date-picker
@change="changeTime2"
v-model="queryParams.time2"
type="datetimerange"
range-separator="——"
:start-placeholder="$t('CK_KS_4')"
:end-placeholder="$t('CK_KS_5')"
value-format="yyyy-MM-dd HH:mm:ss"
:unlink-panels="true"
>
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
</div>
</el-collapse-transition>
<el-row style="margin-left: 20px">
<el-col :span="4">
<div class="searchbox">
<el-button class="searchbtn" @click="getBusinessList">
{{ $t("MN_T_2") }}</el-button
>
<el-button @click="reChongzhi"> {{ $t("MN_T_3") }}</el-button>
</div>
</el-col>
<div class="openClose" @click="changeActive">
<i
:class="isActive ? 'el-icon-arrow-up' : 'el-icon-arrow-down'"
></i>
<div>{{ isActive ? $t("MN_F_T_545") : $t("MN_F_T_546") }}</div>
</div>
</el-row>
</el-form>
</div>
<div class="maintop">
<div class="mainbtn">
<el-button
size="small"
@click="handleImport"
class="thebtn1"
v-hasButtons="['BasicBusinessImport']"
>
{{ $t("MN_T_9") }}</el-button
>
<el-button size="small" class="thebtn2" @click="importTemplate">
{{ $t("MN_T_10") }}</el-button
>
</div>
</div>
<div class="main">
<div class="maintable">
<el-table
:data="tableData"
height="400px"
style="width: 100%"
:header-cell-style="{ background: '#EEEEEE' }"
:row-class-name="tableRowClassName"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55"> </el-table-column>
<el-table-column
align="center"
prop="memberCode"
:label="$t('MN_T_1')"
>
</el-table-column>
<el-table-column
align="center"
prop="newMemberName"
:label="$t('ENU_TRADE_T_800')"
>
<template slot-scope="scope">
<el-input v-model="scope.row.newMemberName"></el-input>
</template>
</el-table-column>
<el-table-column
min-width="130px"
align="center"
prop="newPhone"
:label="$t('ENU_TRADE_T_801')"
>
<template slot-scope="scope">
<el-input clearable v-model="scope.row.newPhone"></el-input>
</template>
</el-table-column>
<el-table-column
align="center"
prop="memberName"
:label="$t('CK_KS_14')"
>
</el-table-column>
<el-table-column align="center" prop="phone" :label="$t('w_0052')">
</el-table-column>
<el-table-column align="center" prop="pkRegisterGradeVal" :label="$t('CK_KS_15')">
</el-table-column>
<el-table-column
align="center"
prop="pkAwardsVal"
:label="$t('CK_KS_16')"
>
</el-table-column>
<el-table-column
align="center"
prop="vertexName"
:label="$t('MN_F_T_829')"
>
</el-table-column>
<el-table-column
align="center"
prop="teamName"
:label="$t('MN_F_T_122')"
>
</el-table-column>
<el-table-column
align="center"
prop="centerMemberCode"
:label="$t('MN_F_T_825')"
>
</el-table-column>
<el-table-column
align="center"
prop="centerMemberName"
:label="$t('MN_F_T_826')"
>
</el-table-column>
<el-table-column
align="center"
prop="creationTime"
:label="$t('PER_DA_9')"
>
</el-table-column>
<el-table-column
align="center"
prop="payTime"
:label="$t('MN_F_T_914')"
>
</el-table-column>
<el-table-column
align="center"
prop="editNumber"
:label="$t('MN_F_T_833')"
>
</el-table-column>
</el-table>
</div>
</div>
<div class="main">
<div
class="main_content"
v-for="(item, index) in handleBusinessList"
:key="index"
>
<el-form ref="form" :model="form" label-width="130px">
<!-- <el-checkbox-group v-model="item.wowList">
<el-checkbox> -->
<el-form-item :label="item.editTypeName">
<!-- 单选 -->
<el-checkbox-group
v-if="item.buttonType == 1"
:max="1"
v-model="item.businessValueList"
>
<el-checkbox
v-for="aitem in item.enumEntityList"
:key="aitem.value"
:label="aitem.value"
>{{ aitem.label }}</el-checkbox
>
</el-checkbox-group>
<!-- 多选 -->
<el-checkbox-group
v-if="item.buttonType == 2"
v-model="item.businessValueList"
>
<el-checkbox
v-for="aitem in item.enumEntityList"
:key="aitem.value"
:label="aitem.value"
>{{ aitem.label }}</el-checkbox
>
</el-checkbox-group>
<!-- 输入框 -->
<el-input
v-if="item.buttonType == 3"
type="number"
style="width: 150px"
v-model="item.businessValueList[0]"
>
<i slot="suffix">%</i>
</el-input>
</el-form-item>
<!-- </el-checkbox>
</el-checkbox-group> -->
</el-form>
</div>
</div>
<div class="footer">
<div style="margin: 0 auto">
<el-button class="thebtn"> {{ $t("ENU_P_TYPE0") }}</el-button>
<el-button
type="primary"
class="thebtn"
@click="saveDate"
v-hasButtons="['BasicBusinessConfirm']"
>
{{ $t("MN_F_32") }}</el-button
>
</div>
</div>
<el-dialog
:title="$t('MN_F_T_1033')"
:close-on-click-modal="false"
:visible.sync="errorShow"
width="600px"
append-to-body
>
<div>
<el-table
:data="errorData"
height="400px"
style="width: 100%"
:header-cell-style="{ background: '#EEEEEE' }"
:row-class-name="tableRowClassName"
>
<el-table-column
align="center"
prop="memberCode"
:label="$t('MN_T_1')"
>
</el-table-column>
<el-table-column
align="center"
prop="errorMsg"
:label="$t('MN_F_T_1034')"
>
</el-table-column>
</el-table>
</div>
<div class="footer" style="text-align: center">
<div style="margin: 0 auto">
<el-button class="thebtn" @click="errorShow = false">
{{ $t("ENU_P_TYPE0") }}</el-button
>
<el-button type="primary" class="thebtn" @click="errorShow = false">
{{ $t("MN_F_32") }}</el-button
>
</div>
</div>
</el-dialog>
<el-dialog
:title="upload.title"
:close-on-click-modal="false"
:visible.sync="upload.open"
width="600px"
append-to-body
>
<el-upload
ref="upload"
:limit="1"
accept=".xlsx, .xls"
:headers="upload.headers"
:action="upload.url"
:disabled="upload.isUploading"
:on-progress="handleFileUploadProgress"
:on-success="handleFileSuccess"
:on-exceed="handleExceed"
:auto-upload="false"
drag
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
{{ $t("MN_F_T_229") }}
<em>{{ $t("MN_F_T_230") }}</em>
</div>
<div class="el-upload__tip" slot="tip">
<el-link type="info" style="font-size: 12px" @click="importTemplate">
{{ $t("MN_T_10") }}</el-link
>
</div>
<div class="el-upload__tip" style="color: red" slot="tip">
{{ $t("MN_F_T_231") }}
</div>
</el-upload>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm">{{
$t("ENU_P_TYPE4")
}}</el-button>
<el-button @click="upload.open = false">{{
$t("ENU_P_TYPE0")
}}</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import topBar from "@/components/topBar/checked";
import { getToken } from "@/utils/auth";
import { getRouters } from "@/api/settle";
import {
getHandleBusinessEnum,
getBusinessList,
businessCheck,
} from "@/api/business";
import { getAwardsListChiose,getgradeRanglist } from "@/api/level";
import { getvertexValue, getmemberTeamList } from "@/api/financialCase";
export default {
name: "Jcyw",
components: {
topBar,
},
data() {
return {
moren: "jcyw",
topList: [
{
name: this.$t("MN_F_T_1015"),
path: "jcyw",
url: "BasicBusiness",
},
{
name: this.$t("MN_F_T_12"),
path: "ddyw",
url: "OrderBusiness",
},
// {
// name: "确认业务",
// path: "shyw",
// },
// {
// name: "在线签呈",
// path: "zxqc",
// },
],
multipleSelection: [],
wowList: [],
queryParams: {
memberCode: "",
memberName: "",
pkAwards: "",
vertexId: "",
teamId: "",
editNumber: "",
phone: "",
centerMemberCode: "",
centerMemberName: "",
startDate: "",
endDate: "",
startDatePay: "",
endDatePay: "",
time1: [],
time2: [],
},
tableData: [],
// 折叠搜索框
isActive: false,
form: {},
handleBusinessList: [],
errorShow: false,
errorData: [],
awardsList: [],
gradeRangList: [],
memberTeamList: [],
vertexList: [],
upload: {
// 是否显示弹出层(物流导入)
open: false,
// 弹出层标题(物流导入)
title: "",
// 是否禁用上传
isUploading: false,
// 是否更新已经存在的物流数据
updateSupport: 0,
// 设置上传的请求头部
headers: { Authorization: "Bearer " + getToken() },
// 上传的地址
url:
process.env.VUE_APP_BASE_API +
"/member/manage/handle-business/importData",
},
};
},
created() {
this.getBusinessList();
this.getHandleBusinessEnum();
this.getUserRoute();
},
methods: {
// 路由权限
getUserRoute() {
getRouters().then((res) => {
res.data.forEach((item) => {
this.topList.forEach((items) => {
if (item.routeName == items.url) {
this.$set(items, "changed", true);
}
});
});
});
},
checkRadio(value) {},
//下载模板
importTemplate() {
this.download(
"/member/manage/handle-business/download-template",
{},
`${this.$t("MN_F_T_1016")}-${new Date().getTime()}.xlsx`
);
},
/** 导入按钮操作 */
handleImport() {
this.upload.title = this.$t("MN_F_T_1015");
this.upload.open = true;
},
// 文件上传中处理
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true;
},
// 文件上传成功处理
handleFileSuccess(response, file, fileList) {
var fileName = response.fileName;
if (fileName != undefined && fileName != "") {
}
if (response.code == 200) {
this.tableData = response.data;
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
this.$alert(response.msg, this.$t("MN_F_T_233"), {
dangerouslyUseHTMLString: true,
});
} else if (response.code == 504) {
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
var errorMsg = response.data.map(item => item.memberCode).join(',');
this.$alert(errorMsg + response.msg, this.$t("MN_F_T_233"), {
dangerouslyUseHTMLString: true,
});
} else {
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
this.$alert(response.msg, this.$t("MN_F_T_233"), {
dangerouslyUseHTMLString: true,
});
}
},
// 上传文件数量超出后的动作
handleExceed() {
this.upload.isUploading = false;
this.msgInfo(this.$t("MN_F_T_234"));
},
// 提交上传文件
submitFileForm() {
this.$refs.upload.submit();
},
//点击下一步
saveDate() {
// console.log("🌈", this.handleBusinessList);
if (this.multipleSelection.length > 0) {
businessCheck({
businessMemberList: this.multipleSelection,
handleBusinessList: this.handleBusinessList,
}).then((res) => {
if (res.code == 200) {
this.$message({
message: res.msg,
type: "success",
});
this.$router.push({
path: "/information/business/shyw",
query: {
data: JSON.stringify(res.data),
handleBusinessList: JSON.stringify(this.handleBusinessList),
},
});
} else if (res.code == 504 && res.data) {
this.errorShow = true;
this.errorData = res.data;
}
});
} else {
this.$message({
message: this.$t("MN_F_T_1017"),
type: "warning",
});
}
},
changeTime1(val) {
this.queryParams.startDate = val[0];
this.queryParams.endDate = val[1];
},
changeTime2(val) {
this.queryParams.startDatePay = val[0];
this.queryParams.endDatePay = val[1];
},
getBusinessList() {
getBusinessList(this.queryParams).then((res) => {
this.tableData = res.rows;
});
},
getHandleBusinessEnum() {
//获取基础业务枚举
getHandleBusinessEnum().then((res) => {
res.data.forEach((ele) => {
ele.businessValueList = [];
ele.wowList = [];
});
this.handleBusinessList = res.data;
});
getgradeRanglist().then((res) => {
this.gradeRangList = res.data;
});
getAwardsListChiose().then((res) => {
this.awardsList = res.rows;
});
getmemberTeamList().then((res) => {
this.memberTeamList = res.rows;
});
getvertexValue().then((res) => {
this.vertexList = res.data;
});
},
// 展开折叠
changeActive() {
this.isActive = !this.isActive;
},
//重置
reChongzhi() {
this.queryParams = {
memberCode: "",
memberName: "",
time1: [],
time2: [],
};
this.getBusinessList();
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
tableRowClassName({ row, rowIndex }) {
if (rowIndex % 2 == 1) {
return "warning-row";
} else if (rowIndex % 2 == 0) {
return "success-row";
}
return "";
},
},
};
</script>
<style lang="scss" scoped>
::v-deep .el-date-editor.el-input,
.el-date-editor.el-input__inner {
width: 100%;
}
::v-deep .el-input__inner {
height: 32px;
line-height: 32px;
}
::v-deep .el-date-editor .el-range__close-icon {
margin-top: -10px;
}
::v-deep .el-date-editor .el-range-separator {
margin-top: -10px;
}
::v-deep .el-date-editor .el-range__icon {
margin-top: -10px;
}
::v-deep .el-button {
padding: 8px 20px;
}
::v-deep .el-form-item {
margin-bottom: 10px;
}
::v-deep .el-table .warning-row {
background: #f9f9f9;
}
::v-deep .el-table .success-row {
background: #ffffff;
}
::v-deep .el-table thead {
color: #000000;
}
.openClose {
margin-top: 10px;
margin-right: 10px;
color: #666666;
text-align: center;
}
.page1 {
padding: 10px 20px;
background: #f9f9f9;
font-size: 14px;
.thetopbox {
background: #ffffff;
border-radius: 8px;
padding: 20px 0;
.searchbox {
display: flex;
align-items: center;
.searchtitle {
margin-right: 10px;
}
.searchbtn {
background: #c8161d;
color: #ffffff;
}
}
}
.footer {
display: flex;
justify-content: center;
align-items: center;
padding: 15px 0;
.thebtn {
width: 120px;
height: 38px;
}
}
.maintop {
display: flex;
padding-top: 10px;
justify-content: space-between;
align-items: center;
.mainbtn {
.thebtn1 {
color: #ffffff;
background: #ec6c00;
}
.thebtn2 {
color: #ffffff;
background: #009b58;
}
.thebtn3 {
color: #ffffff;
background: #e41b1b;
}
.thebtn4 {
color: #ffffff;
background: #53b11e;
}
}
}
.main {
margin-top: 10px;
background: #ffffff;
border-radius: 8px;
box-shadow: 0px 2px 20px 0px rgba(238, 238, 238, 0.5);
.main_title {
display: flex;
align-items: center;
padding: 10px 0;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
.bluekuai {
width: 5px;
height: 19px;
background: #4391fd;
margin-right: 20px;
}
.title_word {
font-size: 14px;
font-family: MicrosoftYaHei-Bold, MicrosoftYaHei;
font-weight: bold;
color: #333333;
}
}
.main_content {
padding: 0px 25px;
display: flex;
align-items: center;
margin: 10px 0;
border: 1px solid #eeeeee;
.el-form-item {
margin-bottom: 0px !important;
}
}
}
}
</style>