<!-- 公司资质 -->
|
<template>
|
<div class="aptitude">
|
<el-button
|
v-if="applyInfo.occurtype=='01'"
|
type="primary"
|
style="margin-bottom:30px"
|
icon="el-icon-circle-plus-outline"
|
@click="addAptitude"
|
size="medium"
|
>新增公司资质信息</el-button>
|
<el-table
|
stripe
|
highlight-current-row
|
:data="aptitudeData"
|
:header-cell-style="{background:'#f5f5f5',color:'#222222'}"
|
:cell-style="cell"
|
v-loading="loading"
|
>
|
<el-table-column min-width="220" prop="aptname" label="资质名称" show-overflow-tooltip>
|
<template slot="header">
|
<span>
|
<span class="red-star">*</span>
|
<span style="padding-left:8px">资质名称</span>
|
</span>
|
</template>
|
<template slot-scope="{row}">
|
<span style="padding-left:15px" v-show="!row.isEdit">{{row.aptname}}</span>
|
<el-input
|
style="padding-left:15px"
|
maxlength="100"
|
size="small"
|
v-show="row.isEdit"
|
v-model="row.aptname"
|
placeholder="请输入"
|
></el-input>
|
</template>
|
</el-table-column>
|
<el-table-column min-width="200" prop="aptcertstartdate" label="资质发证日期">
|
<template slot="header">
|
<span>
|
<span class="red-star">*</span>
|
<span style="padding-left:8px">资质发证日期</span>
|
</span>
|
</template>
|
<template slot-scope="{row}">
|
<span style="padding-left:15px" v-show="!row.isEdit">{{row.aptcertstartdate}}</span>
|
<div style="padding-left:15px">
|
<el-date-picker
|
v-model="row.aptcertstartdate"
|
type="date"
|
format="yyyy/MM/dd"
|
value-format="yyyy/MM/dd"
|
size="small"
|
placeholder="选择日期"
|
v-show="row.isEdit"
|
></el-date-picker>
|
</div>
|
</template>
|
</el-table-column>
|
<el-table-column min-width="200" prop="aptcertenddate" label="资质到期日期">
|
<template slot="header">
|
<span>
|
<span class="red-star">*</span>
|
<span style="padding-left:8px">资质到期日期</span>
|
</span>
|
</template>
|
<template slot-scope="{row}">
|
<span style="padding-left:15px" v-show="!row.isEdit">{{row.aptcertenddate}}</span>
|
<div style="padding-left:15px">
|
<el-date-picker
|
v-model="row.aptcertenddate"
|
type="date"
|
format="yyyy/MM/dd"
|
value-format="yyyy/MM/dd"
|
size="small"
|
placeholder="选择日期"
|
v-show="row.isEdit"
|
></el-date-picker>
|
</div>
|
</template>
|
</el-table-column>
|
<el-table-column min-width="220" prop="aptcertorgname" show-overflow-tooltip label="资质发证机构">
|
<template slot="header">
|
<span>
|
<span class="red-star">*</span>
|
<span style="padding-left:8px">资质发证机构</span>
|
</span>
|
</template>
|
<template slot-scope="{row}">
|
<span style="padding-left:15px" v-show="!row.isEdit">{{row.aptcertorgname}}</span>
|
<el-input
|
maxlength="100"
|
style="padding-left:15px"
|
size="small"
|
v-show="row.isEdit"
|
v-model="row.aptcertorgname"
|
placeholder="请输入"
|
></el-input>
|
</template>
|
</el-table-column>
|
<el-table-column v-if="applyInfo.occurtype=='01'" min-width="110" label="操作">
|
<template slot-scope="scope">
|
<el-button type="text" @click.native="handleEdit(scope.row)" v-if="!scope.row.isEdit">修改</el-button>
|
<el-button type="text" @click.native="handleSave(scope.row,scope.$index)" v-else>保存</el-button>
|
<el-button
|
type="text"
|
@click.native="handleCancel(scope.row,scope.$index)"
|
v-if="scope.row.isCancel"
|
>取消</el-button>
|
<el-button type="text" @click.native="handleDelete(scope.row,scope.$index)" v-else>删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<el-pagination
|
background
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
:current-page.sync="currentPage"
|
:page-sizes="[10, 20, 50, 100]"
|
:page-size="10"
|
layout="prev, pager, next, jumper, total, sizes"
|
:total="total"
|
></el-pagination>
|
</div>
|
</template>
|
<script>
|
import { qryAptList, saveZbdAptInfoPre, deleteAptInfo } from "@api/product";
|
import common from "@/utils/common";
|
import { setStorage, getStorage } from "@/utils/storage";
|
export default {
|
data() {
|
return {
|
aptitudeData: [],
|
initialArr: [],
|
total: 0,
|
currentPage: 1,
|
loading: false,
|
applyInfo: this.$store.state.product.applyInfo,
|
form: {
|
currentPage: 1,
|
pageSize: 10,
|
customerID: this.$store.state.product.applyInfo.customerid,
|
objectType: this.$store.state.product.applyInfo.objectType,
|
serialNo: this.$store.state.product.applyInfo.serialNo
|
}
|
};
|
},
|
created() {
|
this.getAptList();
|
},
|
methods: {
|
cell({ row, column, rowIndex, columnIndex }) {
|
const { applyInfo } = this;
|
const { refuseFlag } = applyInfo
|
if(refuseFlag == 1){
|
const { businessEntInfo } = this.$store.state.product.fields;
|
const { businessAptList } = businessEntInfo;
|
if(businessAptList&&businessAptList.length){
|
for (let i = 0; i < businessAptList.length; i++) {
|
const object = businessAptList[i];
|
for (const key in object) {
|
if (row[key] != object[key] && column.property == key) {
|
return { color: "#222", "font-weight": "700" };
|
}
|
}
|
}
|
}
|
}
|
},
|
// 查询公司资质信息列表
|
getAptList() {
|
this.loading = true;
|
qryAptList(this.form).then(res => {
|
this.loading = false;
|
const { result, total } = res;
|
this.aptitudeData = [];
|
this.initialArr = [];
|
result.records.forEach(val => {
|
const obj = {};
|
for (const key in val) {
|
obj[key] = val[key];
|
}
|
this.aptitudeData.push(obj);
|
this.initialArr.push(Object.assign({}, obj));
|
});
|
this.total = result.total;
|
this.$emit("sendAptList", this.aptitudeData);
|
});
|
},
|
// 新增公司资质信息
|
addAptitude() {
|
for (let i = 0; i < this.aptitudeData.length; i++) {
|
if (this.aptitudeData[i].isEdit) {
|
this.$message.warning("请先保存当前公司资质信息再新增");
|
return;
|
}
|
}
|
this.aptitudeData.unshift({
|
applyserialno: this.$store.state.product.applyInfo.serialNo,
|
customerid: this.$store.state.product.applyInfo.customerid,
|
aptname: "",
|
aptcertstartdate: "",
|
aptcertenddate: "",
|
aptcertorgname: "",
|
isEdit: true
|
});
|
},
|
// 修改
|
handleEdit(row) {
|
this.$set(row, "isEdit", true);
|
this.$set(row, "isCancel", true);
|
},
|
// 保存
|
handleSave(row) {
|
if (!row.aptname) {
|
this.$message.warning("资质名称不能为空");
|
return;
|
}
|
if (!row.aptcertstartdate) {
|
this.$message.warning("资质发证日期不能为空");
|
return;
|
}
|
if (!row.aptcertenddate) {
|
this.$message.warning("资质到期日期不能为空");
|
return;
|
}
|
if (!row.aptcertorgname) {
|
this.$message.warning("资质发证机构不能为空");
|
return;
|
}
|
saveZbdAptInfoPre(row).then(async res => {
|
if (res.code == "00") {
|
// 保存成功后重新查询列表
|
this.$message.success("保存成功");
|
this.$set(row, "isEdit", false);
|
this.getAptList();
|
}
|
});
|
},
|
// 取消
|
handleCancel(row, index) {
|
const arr = [];
|
for (let i = 0; i < this.initialArr.length; i++) {
|
if (i == index) {
|
for (const key in row) {
|
if (
|
key != "isEdit" &&
|
key != "isCancel" &&
|
row[key] != this.initialArr[i][key]
|
) {
|
arr.push(key);
|
}
|
}
|
}
|
}
|
if (arr.length) {
|
common.comfirm("提示", "当前有数据未保存，是否放弃保存？", () => {
|
this.$set(row, "isEdit", false);
|
this.$set(row, "isCancel", false);
|
arr.forEach(val => {
|
for (const key in this.initialArr[index]) {
|
if (this.initialArr[index].hasOwnProperty(val)) {
|
this.aptitudeData[index][key] = this.initialArr[index][key];
|
}
|
}
|
});
|
});
|
} else {
|
this.$set(row, "isEdit", false);
|
this.$set(row, "isCancel", false);
|
}
|
},
|
// 删除
|
handleDelete(row, index) {
|
if (row.serialno) {
|
common.comfirm(
|
"提示",
|
`请确认是否删除公司资质名称: ${row.aptname}`,
|
() => {
|
deleteAptInfo({ serialno: row.serialno }).then(res => {
|
if (res.code == "00") {
|
// 删除成功后重新查询列表
|
this.$message.success("删除成功");
|
this.getAptList();
|
}
|
});
|
}
|
);
|
} else {
|
this.aptitudeData.splice(index, 1);
|
}
|
},
|
// 设置每页多少条
|
handleSizeChange(val) {
|
this.form.pageSize = val;
|
this.getAptList(this.form);
|
},
|
// 查询当前页
|
handleCurrentChange(val) {
|
this.form.currentPage = val;
|
this.getAptList(this.form);
|
}
|
}
|
};
|
</script>
|
<style lang="stylus">
|
.aptitude {
|
width: 100%;
|
margin-bottom: 24px;
|
|
>.el-button {
|
padding: 9px 12px;
|
}
|
|
.red-star {
|
width: 7px;
|
display: inline-block;
|
vertical-align: middle;
|
color: #FF4300;
|
}
|
}
|
</style>
|
