<template>
|
<div class="other-share-holder">
|
<el-row class="add-button" v-if="addorupdate === '01'">
|
<el-col :span="24">
|
<el-button
|
type="primary"
|
size="small"
|
icon="el-icon-circle-plus-outline"
|
@click="handleAddCus"
|
class="add_btn"
|
>新增</el-button>
|
</el-col>
|
</el-row>
|
|
<ProTable
|
:pageInfo="pageInfo"
|
@doAction="doAction"
|
@handleCurrentChange="handleCurrentChange"
|
@handleSizeChange="handleSizeChange"
|
:isAutoIndex="true"
|
:list="records"
|
:header="tableHeader"
|
:loading="loading"
|
/>
|
|
<el-dialog
|
:title="dialogTitle"
|
:visible.sync="dialogVisible"
|
:close-on-click-modal="false"
|
:close-on-press-escape="false"
|
:destroy-on-close="true"
|
:show-close="false"
|
custom-class="stock_dialog"
|
width="890px"
|
center
|
>
|
<CreateForms
|
ref="holderForms"
|
v-if="dialogVisible"
|
:isReset="true"
|
:isView="isView"
|
:isShowBorder="isShowBorder"
|
:screenWidth="1000"
|
:formItems="formItems"
|
:defValues="defValues"
|
:formRules="formRules"
|
@handleInputChange="handleInputChange"
|
@handleSelOnChange="handleSelOnChange"
|
/>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="handleDialogCancel">取消</el-button>
|
<el-button
|
type="primary"
|
v-if="!isView"
|
@click="saveBoardInfo"
|
>{{ addOrModify === "0" ? "新增" : "修改" }}</el-button>
|
</span>
|
</el-dialog>
|
|
<Dialog
|
v-model="isDelete"
|
title="股东信息删除确认"
|
:buttons="[{text: '取消'},{text: '确定', type: 'primary'}]"
|
@handleClick="clickDelete"
|
:contentText="`请确认是否需要删除${tempRecord.shareholderName}股东的信息?`"
|
></Dialog>
|
</div>
|
</template>
|
|
<script>
|
import ProTable from "@/views/components/ProTable";
|
import CreateForms from "@/views/components/CreateForms";
|
import Dialog from "../components/Dialog";
|
|
import {
|
qryShareholderList,
|
delShareholderInfo,
|
shareholderInfoUpdate,
|
getDictionaryList
|
} from "@/http/api.js";
|
import { enterpriseCusOtherShareholder } from "../config/column.config";
|
import { stockInfoDefault } from "../config/defValues.config";
|
import { stockInfo } from "../config/formItem.config";
|
import { stockInfoRules } from "../config/rules.config";
|
|
export default {
|
components: {
|
ProTable,
|
Dialog,
|
CreateForms
|
},
|
props: {
|
tableHeader: {
|
type: [Object, Array],
|
default: () => {
|
return [];
|
}
|
},
|
addorupdate: {
|
type: [String],
|
default: ""
|
}
|
},
|
created() {
|
this.init();
|
},
|
data() {
|
return {
|
columnConfig: [...enterpriseCusOtherShareholder],
|
loading: false,
|
isShowBorder: true,
|
dialogTitle: "",
|
isView: false,
|
dialogVisible: false,
|
formItems: [...stockInfo],
|
formRules: { ...stockInfoRules },
|
defValues: { ...stockInfoDefault },
|
addOrModify: "", // 0-新增 1-修改
|
pageInfo: {
|
currentPage: 1,
|
pageSize: 10,
|
total: 0
|
},
|
records: [],
|
tempRecord: {},
|
isDelete: false,
|
passValidate: false, // 控制是否通过校验
|
objectNo: "" // 存放customerId
|
};
|
},
|
methods: {
|
async init() {
|
const { pageInfo, $route } = this;
|
const { query } = $route;
|
const { customerId } = query;
|
this.objectNo = customerId;
|
const params = {
|
objectNo: customerId,
|
...pageInfo
|
};
|
const { result } = await qryShareholderList(params);
|
this.records = result.records.map(item => {
|
const newItem = { ...item };
|
newItem.operationOption = [
|
{ key: "delete", label: "删除", value: true }
|
];
|
return newItem;
|
});
|
this.$set(this.pageInfo, "total", result.total);
|
},
|
setSelectOptions() {
|
const { formItems } = this;
|
formItems.forEach(({ name }) => {
|
if (name === "shareholderType" || name === 'certType') {
|
this.getDictionaryList(name);
|
}
|
});
|
this.dialogTitle = "股东信息";
|
this.dialogVisible = true;
|
this.addOrModify = "0";
|
},
|
async getDictionaryList(name) {
|
const codeNo = name.substring(0, 1).toUpperCase() + name.substring(1);
|
const { result } = await getDictionaryList({ codeNo });
|
const list = result.map(item => {
|
return {
|
label: item.itemname,
|
value: item.itemno
|
}
|
})
|
this.updateValue(name, {options:list});
|
},
|
updateValue(index, info) {
|
const { formItems } = this;
|
const nameIndex = formItems.findIndex(({name}) => name === index)
|
if (nameIndex > -1) {
|
const preInfo = formItems[nameIndex]
|
|
this.$set(formItems,nameIndex,{...preInfo,...info})
|
}
|
},
|
// 新增
|
handleAddCus() {
|
this.clearValue()
|
this.isView = false;
|
this.isShowBorder = true;
|
this.setSelectOptions();
|
},
|
clearValue() {
|
const { defValues } = this
|
for (let key in defValues) {
|
defValues[key] = ''
|
}
|
},
|
// 取消
|
handleDialogCancel() {
|
this.clearValue()
|
this.dialogVisible = false;
|
},
|
|
// 保存
|
async saveBoardInfo() {
|
const { objectNo } = this;
|
await this.vailateForm();
|
const { passValidate } = this;
|
if (!passValidate) {
|
return false;
|
}
|
const formRef = this.$refs.holderForms;
|
const { model } = formRef.$refs["createForm"];
|
const { holdingRatio } = model
|
if (!Number(holdingRatio) && holdingRatio) {
|
this.$message.warning('持股比例只能输入数字或包含带一位小数点的数字,请仔细检查!')
|
} else {
|
const temp = { ...model, objectNo };
|
// console.log(formRef.$refs["createForm"].model)
|
try {
|
await shareholderInfoUpdate(temp);
|
this.dialogVisible = false;
|
this.$message.success("新增成功");
|
this.init();
|
} catch (error) {
|
console.log(error);
|
}
|
}
|
},
|
|
// 校验规则
|
vailateForm() {
|
const formRef = this.$refs.holderForms;
|
// console.log(formRef)
|
formRef.$refs["createForm"].validate(async valid => {
|
// console.log(valid)
|
if (valid) {
|
this.passValidate = true;
|
return true;
|
} else {
|
this.passValidate = false;
|
this.$message.error("请完善必填项！");
|
return false;
|
}
|
});
|
},
|
// input值修改时触发
|
handleInputChange(name, value) {
|
const { formItems } = this;
|
// formItems.map(item => {
|
// if (item.name === name) {
|
// item.value = value;
|
// }
|
// });
|
// console.log(formItems);
|
// console.log(name, value);
|
},
|
// select值修改时触发
|
handleSelOnChange(name, value) {
|
|
},
|
// 修改翻页条数
|
handleSizeChange(val) {
|
this.pageInfo.pageSize = val;
|
this.getBoardList();
|
},
|
// 修改翻页数
|
handleCurrentChange(val) {
|
this.pageInfo.currentPage = val;
|
this.getBoardList();
|
},
|
// 表单事件回调
|
doAction(name, item, { key }) {
|
this.tempRecord = item;
|
if (key === "delete") {
|
this.isDelete = true;
|
}
|
},
|
|
// 删除按钮回调事件
|
clickDelete(index) {
|
if (index === 0) {
|
this.isDelete = false;
|
} else {
|
this.toDelete();
|
}
|
},
|
|
async toDelete() {
|
const { tempRecord } = this;
|
const { serialno } = tempRecord;
|
try {
|
await delShareholderInfo({ serialno });
|
this.$message.success("删除成功");
|
this.isDelete = false;
|
this.init();
|
} catch (error) {
|
console.log(error)
|
this.$message.warning('删除失败')
|
this.isDelete = false;
|
}
|
}
|
}
|
};
|
</script>
|
|
<style lang="less" scoped>
|
.other-share-holder {
|
& .add-button {
|
margin-bottom: 20px;
|
}
|
& .stock_dialog {
|
& .el-dialog__footer {
|
& .dialog-footer {
|
& .el-button--default {
|
width: 120px;
|
height: 30px;
|
line-height: 7px;
|
border-radius: 4px;
|
border: 1px solid rgba(204, 204, 204, 1);
|
}
|
& .el-button--primary {
|
width: 120px;
|
height: 30px;
|
line-height: 7px;
|
background: #0081f0;
|
border-color: #0081f0;
|
border-radius: 4px;
|
margin-left: 40px;
|
}
|
}
|
}
|
}
|
}
|
</style>
|
