|
@@ -0,0 +1,499 @@
|
|
|
+<template>
|
|
|
+ <div class="AddPlanWrapper clearfix">
|
|
|
+ <crumbs
|
|
|
+ :title="!isEdit ? '医院管理-添加医院' : '医院管理-修改医院'"
|
|
|
+ class="topBack"
|
|
|
+ :param="$route.params"
|
|
|
+ linkTo="HospitalCDSS"
|
|
|
+ ></crumbs>
|
|
|
+ <div class="AddPlanBox">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form ref="form" :model="form" label-width="110px" :rules="rules">
|
|
|
+ <el-form-item label="医院名称" prop="hospitalName" style="display:inline-block;width:100%">
|
|
|
+ <el-input
|
|
|
+ v-model="form.hospitalName"
|
|
|
+ placeholder="2-30位,可输入汉字、字母、数字和下划线"
|
|
|
+ @blur="handlePinyin($event)"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="医院名称拼音" prop="spell" style="display:inline-block;width:300px">
|
|
|
+ <el-input v-model="form.spell" placeholder="请输入医院名称拼音"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <!-- <el-form-item label="医院编码" prop="hospitalCode">
|
|
|
+ <el-input v-model="form.hospitalCode" placeholder="4-15位,可输入字母、数字和下划线"></el-input>
|
|
|
+ </el-form-item>-->
|
|
|
+ <el-form-item label="医院地址" prop="address">
|
|
|
+ <el-input v-model="form.address" placeholder="请输入医院地址"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <!-- <p style="text-align: center;padding: 15px 0;border-top: 1px solid #e3e3e3;width: 100%;">关联子医院</p> -->
|
|
|
+ <el-form-item label="关联子医院">
|
|
|
+ <el-table
|
|
|
+ size="mini"
|
|
|
+ :data="form.hospitalRelationVOList"
|
|
|
+ border
|
|
|
+ :style="form.hospitalRelationVOList.length > 0?'min-height: 200px':'60px'"
|
|
|
+ :height="form.hospitalRelationVOList.length > 0?'calc(100vh - 360px)':'60px'"
|
|
|
+ class="tabs"
|
|
|
+ ref="tables"
|
|
|
+ :header-row-style="{height:'40px',cursor: 'pointer'}"
|
|
|
+ :row-style="{height:'40px',cursor: 'pointer'}"
|
|
|
+ :header-cell-style="{height:'40px',borderColor:'#DCDFE6'}"
|
|
|
+ >
|
|
|
+ <el-table-column label="序号" type="index" width="80">
|
|
|
+ <template slot="header" slot-scope="scope">
|
|
|
+ <span class="name">序号</span>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form-item>
|
|
|
+ <i
|
|
|
+ class="el-icon-warning"
|
|
|
+ style="color:#e6a23c;margin-right:10px"
|
|
|
+ v-if="form.hospitalRelationVOList[scope.$index].errorCurrent"
|
|
|
+ ></i>
|
|
|
+ <i
|
|
|
+ class="el-icon-warning"
|
|
|
+ style="color:#fe6c6f;margin-right:10px"
|
|
|
+ v-if="form.hospitalRelationVOList[scope.$index].errorOther"
|
|
|
+ ></i>
|
|
|
+ <span>{{scope.$index+1}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="医院名称">
|
|
|
+ <template slot="header" slot-scope="scope">
|
|
|
+ <span class="star">*</span>
|
|
|
+ <span class="name">医院名称</span>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form-item
|
|
|
+ class="is-request"
|
|
|
+ :prop="'hospitalRelationVOList.' + scope.$index + '.name'"
|
|
|
+ :rules="{
|
|
|
+ required: true, trigger: 'blur'
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ class="inp-name"
|
|
|
+ placeholder="请输入医院名称"
|
|
|
+ maxlength="100"
|
|
|
+ v-model.trim="form.hospitalRelationVOList[scope.$index].name"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="编码">
|
|
|
+ <template slot="header" slot-scope="scope">
|
|
|
+ <span class="star">*</span>
|
|
|
+ <span class="name">编码</span>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form-item
|
|
|
+ :prop="'hospitalRelationVOList.' + scope.$index + '.code'"
|
|
|
+ :rules="{
|
|
|
+ required: true, trigger: 'blur'
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ class="inp-name"
|
|
|
+ placeholder="请输入编码"
|
|
|
+ maxlength="100"
|
|
|
+ v-model.trim="form.hospitalRelationVOList[scope.$index].code"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" width="150" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div class="operation">
|
|
|
+ <el-button @click="addIndex(scope.$index)" type="text" size="small">
|
|
|
+ <img src="../../../images/icon-add.png" alt="新增" />
|
|
|
+ </el-button>
|
|
|
+ <el-button @click="delIndex(scope.$index)" type="text" size="small">
|
|
|
+ <img src="../../../images/icon-delete.png" alt="删除" />
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div class="add" v-if="form.hospitalRelationVOList.length == 0">
|
|
|
+ <!--<el-button icon="el-icon-plus"></el-button>-->
|
|
|
+ <p class="add-border" @click="add">
|
|
|
+ <img src="../../../images/add-nob.png" alt="新增" />
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" @click="onSubmit" :disabled="saveDisable">确定</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ <el-dialog title="提示" :visible.sync="dialogVisible" width="30%">
|
|
|
+ <div class="diag-center">
|
|
|
+ <p class="diag-title">操作失败,请检查"医院名称+医院编码"重复项</p>
|
|
|
+ <p class="title-warning">
|
|
|
+ <i class="el-icon-warning" style="color:#e6a23c"></i>标记为当前父医院的“子医院+子医院编码”重复项
|
|
|
+ </p>
|
|
|
+ <p class="title-warning title-warning-2">
|
|
|
+ <i class="el-icon-warning" style="color:#fe6c6f"></i>标记为与其它父医院的“子医院+子医院编码”重复项
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="dialogVisible = false">关闭</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import api from "@api/cdss.js";
|
|
|
+import pinyin from "../../../js/Convert_Pinyin.js";
|
|
|
+export default {
|
|
|
+ name: "AddHospital",
|
|
|
+ data() {
|
|
|
+ var numreg = /^[a-zA-Z0-9_\u4e00-\u9fa5]+$/;
|
|
|
+ var numreg1 = /^[0-9a-zA-Z_]{1,}$/;
|
|
|
+ var validatePass = (rule, value, callback) => {
|
|
|
+ if (!numreg.test(value)) {
|
|
|
+ callback(new Error("汉字、字母、数字和下划线"));
|
|
|
+ } else {
|
|
|
+ callback();
|
|
|
+ }
|
|
|
+ };
|
|
|
+ var validatePass1 = (rule, value, callback) => {
|
|
|
+ if (!numreg1.test(value)) {
|
|
|
+ callback(new Error("字母、数字和下划线"));
|
|
|
+ } else {
|
|
|
+ callback();
|
|
|
+ }
|
|
|
+ };
|
|
|
+ return {
|
|
|
+ form: {
|
|
|
+ hospitalName: "",
|
|
|
+ spell: "",
|
|
|
+ // hospitalCode: '',
|
|
|
+ address: "",
|
|
|
+ hospitalRelationVOList: []
|
|
|
+ },
|
|
|
+ tableData: [],
|
|
|
+ rules: {
|
|
|
+ hospitalName: [
|
|
|
+ { required: true, message: "医院名称不能为空", trigger: "change" },
|
|
|
+ { min: 2, max: 30, message: "长度2-30位", trigger: "blur" },
|
|
|
+ { required: true, validator: validatePass, trigger: "blur" }
|
|
|
+ ],
|
|
|
+ // hospitalCode: [
|
|
|
+ // { required: true, message: '医院编码不能为空', trigger: 'change' },
|
|
|
+ // { min: 4, max: 15, message: '长度4-15位', trigger: 'blur' },
|
|
|
+ // { required: true, validator: validatePass1, trigger: 'blur' }
|
|
|
+ // ],
|
|
|
+ address: [{ max: 200, message: "长度最多200字", trigger: "change" }],
|
|
|
+ spell: [
|
|
|
+ { max: 30, message: "医院名称拼音长度最多30位", trigger: "change" }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ hospitalId: "",
|
|
|
+ isEdit: false,
|
|
|
+ saveDisable: false,
|
|
|
+ dialogVisible: false,
|
|
|
+ list: []
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ const { isEdit, data } = this.$route.params;
|
|
|
+ this.isEdit = isEdit;
|
|
|
+ if (isEdit) {
|
|
|
+ this.form.hospitalName = data.name;
|
|
|
+ this.form.spell = data.spell;
|
|
|
+ // this.form.hospitalCode = data.code;
|
|
|
+ this.form.address = data.address;
|
|
|
+ this.hospitalId = data.id;
|
|
|
+ this.getByhospitalInfoId(data.id);
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ methods: {
|
|
|
+ getByhospitalInfoId(id) {
|
|
|
+ api.getByhospitalInfoId({ id: id }).then(res => {
|
|
|
+ if (res.data.code === "0") {
|
|
|
+ const data = res.data.data;
|
|
|
+ data.hospitalRelationDTOList.forEach((item, index) => {
|
|
|
+ item.errorOther = false;
|
|
|
+ item.errorCurrent = false;
|
|
|
+ });
|
|
|
+ this.form.hospitalRelationVOList = data.hospitalRelationDTOList;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ onSubmit() {
|
|
|
+ this.$refs.form.validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ this.saveDisable = true;
|
|
|
+ let params = {
|
|
|
+ connect: 1,
|
|
|
+ address: this.form.address,
|
|
|
+ name: this.form.hospitalName,
|
|
|
+ spell: this.form.spell,
|
|
|
+ hospitalRelationVOList: this.form.hospitalRelationVOList
|
|
|
+ // code: this.form.hospitalCode
|
|
|
+ };
|
|
|
+ this.form.hospitalRelationVOList.forEach((item, index) => {
|
|
|
+ item.errorOther = false;
|
|
|
+ item.errorCurrent = false;
|
|
|
+ });
|
|
|
+ if (this.isEdit) {
|
|
|
+ params = Object.assign({}, params, {
|
|
|
+ id: this.hospitalId
|
|
|
+ });
|
|
|
+ }
|
|
|
+ api.saveOrUpdateHosRecordCDSS(params).then(res => {
|
|
|
+ if (res.data.code === "0") {
|
|
|
+ this.$message({
|
|
|
+ showClose: true,
|
|
|
+ message: "保存成功",
|
|
|
+ type: "success",
|
|
|
+ duration: 1000
|
|
|
+ });
|
|
|
+ this.isSaveSuccess = true; // 保存成功,可正常退出
|
|
|
+ this.$router.push({
|
|
|
+ name: "HospitalCDSS",
|
|
|
+ params: Object.assign({}, this.$route.params, {
|
|
|
+ currentPage: 1
|
|
|
+ })
|
|
|
+ });
|
|
|
+ } else if (res.data.code === "20020009") {
|
|
|
+ const data = res.data.data;
|
|
|
+ this.dialogVisible = true;
|
|
|
+ let errorOtherList = [];
|
|
|
+ let errorCurrentList = [];
|
|
|
+ this.getIndex(data.errorOther, errorOtherList);
|
|
|
+ this.getIndex(data.errorCurrent, errorCurrentList);
|
|
|
+ errorOtherList.forEach(i => {
|
|
|
+ this.form.hospitalRelationVOList[i].errorOther = true;
|
|
|
+ });
|
|
|
+ errorCurrentList.forEach(i => {
|
|
|
+ this.form.hospitalRelationVOList[i].errorCurrent = true;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ showClose: true,
|
|
|
+ message: res.data.msg,
|
|
|
+ type: "error",
|
|
|
+ duration: 1000
|
|
|
+ });
|
|
|
+ }
|
|
|
+ this.saveDisable = false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getIndex(data, list) {
|
|
|
+ let arr2Map = {};
|
|
|
+ data.forEach((item, index) => (arr2Map[item.name] = item));
|
|
|
+ this.form.hospitalRelationVOList.forEach((item, index) => {
|
|
|
+ arr2Map[item.name] && list.push(index);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 处理拼音转换
|
|
|
+ handlePinyin(e) {
|
|
|
+ // console.log(e.target.value,'==========');
|
|
|
+ this.form.spell = pinyin.getCamelChars(e.target.value);
|
|
|
+ },
|
|
|
+ add() {
|
|
|
+ this.form.hospitalRelationVOList.push({
|
|
|
+ name: "",
|
|
|
+ code: "",
|
|
|
+ errorOther: false,
|
|
|
+ errorCurrent: false
|
|
|
+ });
|
|
|
+ },
|
|
|
+ addIndex(i) {
|
|
|
+ this.form.hospitalRelationVOList.splice(i + 1, 0, {
|
|
|
+ name: "",
|
|
|
+ code: "",
|
|
|
+ errorOther: false,
|
|
|
+ errorCurrent: false
|
|
|
+ });
|
|
|
+ },
|
|
|
+ delIndex(i) {
|
|
|
+ this.form.hospitalRelationVOList.splice(i, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+.AddPlanWrapper {
|
|
|
+ min-width: 940px;
|
|
|
+ .AddPlanBox {
|
|
|
+ padding: 20px 60px 120px 60px;
|
|
|
+ margin: 70px 20px 0 20px;
|
|
|
+ background: #fff;
|
|
|
+ }
|
|
|
+ color: #606266;
|
|
|
+ .topBack {
|
|
|
+ top: 0;
|
|
|
+ }
|
|
|
+ .title {
|
|
|
+ background-color: #f2f2f2;
|
|
|
+ display: flex;
|
|
|
+ .handleIcon {
|
|
|
+ width: 30px;
|
|
|
+ cursor: pointer;
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ img {
|
|
|
+ width: 20px;
|
|
|
+ height: 20px;
|
|
|
+ }
|
|
|
+ .open {
|
|
|
+ transform: rotate(180deg);
|
|
|
+ }
|
|
|
+ .close {
|
|
|
+ transform: rotate(0deg);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .titlwSwitch {
|
|
|
+ width: 120px;
|
|
|
+ }
|
|
|
+ h4 {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+ .titlwSwitchStatus {
|
|
|
+ margin-left: 16px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .sub {
|
|
|
+ .planItem {
|
|
|
+ display: flex;
|
|
|
+ .sort {
|
|
|
+ width: 60px;
|
|
|
+ display: flex;
|
|
|
+ .top {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ width: 30px;
|
|
|
+ cursor: pointer;
|
|
|
+ img {
|
|
|
+ width: 10px;
|
|
|
+ height: 14px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .down {
|
|
|
+ width: 30px;
|
|
|
+ cursor: pointer;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ img {
|
|
|
+ width: 10px;
|
|
|
+ height: 14px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .openOrClose {
|
|
|
+ display: flex;
|
|
|
+ flex: 1;
|
|
|
+ .planInfo {
|
|
|
+ width: 140px;
|
|
|
+ }
|
|
|
+ .switch {
|
|
|
+ }
|
|
|
+ .planStatus {
|
|
|
+ margin-left: 16px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .showNum {
|
|
|
+ display: flex;
|
|
|
+ width: 160px;
|
|
|
+ /deep/.el-input--small {
|
|
|
+ width: 60px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-button {
|
|
|
+ float: right;
|
|
|
+ }
|
|
|
+ .plus-icon-enter-active {
|
|
|
+ transition: all 0.8s;
|
|
|
+ }
|
|
|
+ .plus-icon-enter {
|
|
|
+ opacity: 0;
|
|
|
+ margin-top: 12px;
|
|
|
+ }
|
|
|
+ .plus-icon-leave-active {
|
|
|
+ transition: all 0.8s;
|
|
|
+ }
|
|
|
+ .plus-icon-leave-active {
|
|
|
+ opacity: 0;
|
|
|
+ margin-top: 12px;
|
|
|
+ }
|
|
|
+}
|
|
|
+.leaveBox {
|
|
|
+ /deep/ .leaveBtn {
|
|
|
+ // margin-right: 46px;
|
|
|
+ background-color: #d7d7d7 !important;
|
|
|
+ border-color: transparent;
|
|
|
+ }
|
|
|
+}
|
|
|
+.tabs {
|
|
|
+ max-width: 100%;
|
|
|
+ min-width: 100%;
|
|
|
+ border-color: #dcdfe6;
|
|
|
+ .star {
|
|
|
+ color: #ff545b;
|
|
|
+ }
|
|
|
+ /deep/.el-input__inner {
|
|
|
+ height: 32px;
|
|
|
+ }
|
|
|
+ .operation {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
+}
|
|
|
+.add-border {
|
|
|
+ border: 1px #48c5d7 dashed;
|
|
|
+ width: 96%;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 30px;
|
|
|
+ cursor: pointer;
|
|
|
+ img {
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+}
|
|
|
+.add {
|
|
|
+ width: 100%;
|
|
|
+ height: 80px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ border: 1px solid #ebeef5;
|
|
|
+ border-top: none;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+.diag-center {
|
|
|
+ text-align: center;
|
|
|
+ .diag-title {
|
|
|
+ font-size: 18px;
|
|
|
+ margin-bottom: 5px;
|
|
|
+ }
|
|
|
+ .title-warning {
|
|
|
+ display: block;
|
|
|
+ margin: 10px 0;
|
|
|
+ }
|
|
|
+ .title-warning-2 {
|
|
|
+ padding-left: 13px;
|
|
|
+ }
|
|
|
+}
|
|
|
+.dialog-footer {
|
|
|
+ display: flex;
|
|
|
+ overflow: hidden;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+</style>
|