You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

383 lines
12 KiB

<template>
<div style="display: flex">
<div>
<el-form
ref="form"
:model="customerOrg.customerOrgRd"
label-width="110px"
:rules="rules"
size="medium"
>
<el-row>
<el-col :span="8">
<el-form-item label="单位名称" prop="displayName">
<el-input
v-model="customerOrg.customerOrgRd.displayName"
></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="简称" prop="shortName">
<el-input
v-model="customerOrg.customerOrgRd.shortName"
></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="发票抬头" prop="invoiceName">
<el-input
v-model="customerOrg.customerOrgRd.invoiceName"
></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="上级单位" prop="parentId">
<el-cascader
v-model="customerOrg.customerOrgRd.parentId"
:options="customerOrg.customerOrgTree"
:props="{
checkStrictly: true,
expandTrigger: 'hover',
...customerOrg.treeprops,
}"
:show-all-levels="false"
clearable
filterable
>
</el-cascader>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="联系电话" prop="telephone">
<el-input
v-model="customerOrg.customerOrgRd.telephone"
></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="传真" prop="fax">
<el-input v-model="customerOrg.customerOrgRd.fax"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="邮政编码" prop="postalCode">
<el-input
v-model="customerOrg.customerOrgRd.postalCode"
></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="地址" prop="address">
<el-input v-model="customerOrg.customerOrgRd.address"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="开户银行" prop="bank">
<el-input v-model="customerOrg.customerOrgRd.bank"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="银行账号" prop="accounts">
<el-input v-model="customerOrg.customerOrgRd.accounts"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="单位性质" prop="orgTypeId">
<el-select
v-model="customerOrg.customerOrgRd.orgTypeId"
placeholder="请选择"
filterable
>
<el-option
v-for="item in data.customerOrgType"
:key="item.id"
:label="item.displayName"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="单位简码" prop="simpleCode">
<el-input
v-model="customerOrg.customerOrgRd.simpleCode"
placeholder="由系统自动生成"
disabled
></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="体检中心" prop="organizationUnitId">
<el-select
v-model="customerOrg.customerOrgRd.organizationUnitId"
placeholder="请选择"
filterable
>
<el-option
v-for="item in data.organizationdata"
:key="item.id"
:label="item.displayName"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="备注" prop="remark">
<el-input v-model="customerOrg.customerOrgRd.remark"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="加锁" prop="isLock">
<el-radio v-model="customerOrg.customerOrgRd.isLock" label="Y"
>是</el-radio
>
<el-radio v-model="customerOrg.customerOrgRd.isLock" label="N"
>否</el-radio
>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="状态" prop="isActive">
<el-radio v-model="customerOrg.customerOrgRd.isActive" label="Y"
>启用</el-radio
>
<el-radio v-model="customerOrg.customerOrgRd.isActive" label="N"
>停用</el-radio
>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="显示顺序" prop="displayOrder">
<el-input
v-model="customerOrg.customerOrgRd.displayOrder"
></el-input>
</el-form-item>
</el-col>
</el-row>
<!-- -->
<el-divider />
<el-row>
<el-col :span="5">
<el-form-item label="创建者">
<el-input
v-model="customerOrg.customerOrgRd.creatorName"
disabled
></el-input>
</el-form-item>
</el-col>
<el-col :span="7">
<el-form-item label="创建时间" style="margin-left: -5%">
<el-input
:value="customerOrg.customerOrgRd.creationTime | dateFormat"
disabled
style="width: 90%"
></el-input>
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="修改者" style="margin-left: -25%">
<el-input
v-model="customerOrg.customerOrgRd.creatorName"
disabled
></el-input>
</el-form-item>
</el-col>
<el-col :span="7">
<el-form-item label="修改时间" style="margin-left: -5%">
<el-input
:value="
customerOrg.customerOrgRd.lastModificationTime | dateFormat
"
disabled
style="width: 90%"
></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<!-- 按钮区域 -->
<div style="margin-left: 10px; margin-top: 5%" width="150px">
<el-button type="primary" @click="add">新增</el-button>
<el-button
type="primary"
@click="Onsubmit('form')"
style="margin-left: 0; margin-top: 10px"
>保存</el-button
>
<div style="margin-top: 10px">
<el-button type="danger" @click="del">删除</el-button>
</div>
</div>
</div>
</template>
<script>
import { mapState, mapMutations } from "vuex";
import { getapi, postapi, putapi, deletapi } from "@/api/api";
import { tcdate, objCopy } from "../../utlis/proFunc";
export default {
components: {},
data() {
return {
data: {
organizationdata: [], //体检中心数据
customerOrgType: [], //单位类别
},
pojo: {
displayName: "string",
shortName: "string",
invoiceName: "string",
parentId: null,
telephone: "string",
fax: "string",
postalCode: "string",
address: "string",
bank: "string",
accounts: "string",
orgTypeId: null,
remark: "string",
isLock: "N",
isActive: "Y",
organizationUnitId: null,
}, //单位 记录 目前新增与更新是一致
rules: {
displayName: [
{ required: true, message: "请输入名称", trigger: "blur" },
],
shortName: [{ required: true, message: "请输入简写", trigger: "blur" }],
orgTypeId: [{ required: true, message: "请输入单位性质" }],
organizationUnitId: [
{ required: true, message: "请输入体检中心", trigger: "blur" },
],
displayOrder: [
{ required: true, message: "请输入显示顺序", trigger: "blur" },
],
},
isshow: false,
};
},
created() {},
//挂载完成
mounted() {
//获取体中心字典数据
this.getoraniztion();
//获取单位类别列表
this.getOrgType();
},
computed: {
...mapState(["customerOrg"]),
},
methods: {
...mapMutations(["setData"]),
//获取组织体检中心数据
getoraniztion() {
getapi("/api/app/organization-units/organization-unit-by-is-peis").then(
(res) => {
this.data.organizationdata = res.data;
}
);
},
//获取单位类别列表
getOrgType() {
getapi("/api/app/customer-org-type/in-filter").then((res) => {
this.data.customerOrgType = res.data.items;
});
},
//更新获取单位树节点数据
getCustomerOrgTree() {
getapi("/api/app/customer-org/by-code-all").then((res) => {
//customerOrgTree = res.data;
console.log("res.data", res.data);
this.setData({ key: "customerOrg.customerOrgTree", value: res.data });
tcdate(this.customerOrg.customerOrgTree);
});
},
//提交
Onsubmit(formName) {
console.log("vuex data", this.customerOrg.customerOrgRd);
this.$refs[formName].validate((valid) => {
if (valid) {
//赋值
objCopy(this.customerOrg.customerOrgRd, this.pojo);
if (typeof this.pojo.parentId === "string") {
if (!this.pojo.parentId || this.pojo.parentId.length < 1) {
this.pojo.parentId = null;
}
} else {
if (this.pojo.parentId && this.pojo.parentId.length > 0) {
this.pojo.parentId =
this.pojo.parentId[this.pojo.parentId.length - 1];
} else {
this.pojo.parentId = null;
}
}
console.log(
"pojo",
this.pojo,
"this.customerOrg.customerOrgRd",
this.customerOrg.customerOrgRd
);
if (this.customerOrg.customerOrgRd.id.length < 1) {
//id为空则新增
postapi(`/api/app/customer-org`, this.pojo).then((res) => {
if (res.code == 1) {
this.$message.success("创健 操作成功");
this.setData({ key: "customerOrg.customerOrgRd", value: res });
this.customerOrg.customerOrgId = res.id;
this.customerOrg.customerOrgRd = res;
this.getCustomerOrgTree();
}
});
} else {
//id不为空则编辑
putapi(
`/api/app/customer-org/${this.customerOrg.customerOrgRd.id}`,
this.pojo
).then((res) => {
if (res.code == 1) {
this.$message.success("更新 操作成功");
this.getCustomerOrgTree();
}
});
}
} else {
alert("未通过数据校验");
return false;
}
});
},
//新增弹框
add() {
this.customerOrg.customerOrgId = "";
this.customerOrg.customerOrgRd = { id: "", isLock: "N", isActive: "Y" };
},
//删除
del() {
deletapi(
`/api/app/customer-org/${this.customerOrg.customerOrgRd.id}`
).then((res) => {
this.$message.success("删除 操作成功");
this.setData({ key: "customerOrg.customerOrgRd", value: { id: "" } });
this.getCustomerOrgTree();
});
},
},
};
</script>
<style scoped></style>