| | |
| | | <div class="app-container"> |
| | | <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> |
| | | <el-form-item label="院区名称" prop="hospAreaName"> |
| | | <el-input style="width:160px" v-model="queryParams.hospAreaName" placeholder="请输入院区名称" clearable @keyup.enter.native="handleQuery"/> |
| | | <el-input style="width: 160px" v-model="queryParams.hospAreaName" placeholder="请输入院区名称" clearable |
| | | @keyup.enter.native="handleQuery" /> |
| | | </el-form-item> |
| | | <!-- <el-form-item label="机构ID" prop="hospid"> |
| | | <el-input v-model="queryParams.hospid" placeholder="请输入机构ID" clearable @keyup.enter.native="handleQuery"/> |
| | | </el-form-item> --> |
| | | <el-form-item label="机构名称" prop="hospName"> |
| | | <el-input v-model="queryParams.hospName" style="width:160px" placeholder="请输入机构名称" clearable @keyup.enter.native="handleQuery"/> |
| | | <el-input v-model="queryParams.hospName" style="width: 160px" placeholder="请输入机构名称" clearable |
| | | @keyup.enter.native="handleQuery" /> |
| | | </el-form-item> |
| | | <!-- <el-form-item label="院区编码" prop="code"> |
| | | <el-input v-model="queryParams.code" placeholder="请输入院区编码" clearable @keyup.enter.native="handleQuery"/> |
| | | </el-form-item> --> |
| | | <!-- <el-form-item label="区划ID" prop="areaid"> |
| | | <el-input v-model="queryParams.areaid" placeholder="请输入区划ID" clearable @keyup.enter.native="handleQuery" style="width:180px"/> |
| | | </el-form-item> --> |
| | | <el-form-item label="区划名称" prop="areaName"> |
| | | <el-input v-model="queryParams.areaName" placeholder="请输入区划名称" clearable @keyup.enter.native="handleQuery" style="width:180px"/> |
| | | <el-input v-model="queryParams.areaName" placeholder="请输入区划名称" clearable @keyup.enter.native="handleQuery" |
| | | style="width: 180px" /> |
| | | </el-form-item> |
| | | <el-form-item label="主院区" prop="mainHospArea"> |
| | | <el-select v-model="queryParams.mainHospArea" placeholder="是否主院区" clearable style="width:110px"> |
| | | <el-select v-model="queryParams.mainHospArea" placeholder="是否主院区" clearable style="width: 110px"> |
| | | <el-option v-for="dict in dict.type.sys_yes_no" :key="dict.value" :label="dict.label" :value="dict.value" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="负责人" prop="principal"> |
| | | <el-input v-model="queryParams.principal" placeholder="请输入负责人" clearable @keyup.enter.native="handleQuery" style="width:140px"/> |
| | | <el-input v-model="queryParams.principal" placeholder="请输入负责人" clearable @keyup.enter.native="handleQuery" |
| | | style="width: 140px" /> |
| | | </el-form-item> |
| | | <!-- <el-form-item label="编制床位" prop="plaitBed"> |
| | | <el-input v-model="queryParams.plaitBed" placeholder="请输入编制床位" clearable @keyup.enter.native="handleQuery"/> |
| | | </el-form-item> --> |
| | | <!-- <el-form-item label="开放床位" prop="openBed"> |
| | | <el-input v-model="queryParams.openBed" placeholder="请输入开放床位" clearable @keyup.enter.native="handleQuery"/> |
| | | </el-form-item> --> |
| | | <!-- <el-form-item label="排序" prop="orderNum"> |
| | | <el-input v-model="queryParams.orderNum" placeholder="请输入排序" clearable @keyup.enter.native="handleQuery"/> |
| | | </el-form-item> --> |
| | | <el-form-item> |
| | | <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> |
| | | <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> |
| | |
| | | |
| | | <el-row :gutter="10" class="mb8"> |
| | | <el-col :span="1.5"> |
| | | <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['hosp:hosp:add']">新增</el-button> |
| | | <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd" |
| | | v-hasPermi="['hosp:hosp:add']">新增</el-button> |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button type="primary" icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate" v-hasPermi="['hosp:hosp:edit']">修改</el-button> |
| | | <el-button type="primary" icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate" |
| | | v-hasPermi="['hosp:hosp:edit']">修改</el-button> |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button type="primary" icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" v-hasPermi="['hosp:hosp:remove']">删除</el-button> |
| | | <el-button type="primary" icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" |
| | | v-hasPermi="['hosp:hosp:remove']">删除</el-button> |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button type="primary" icon="el-icon-download" size="mini" @click="handleExport" v-hasPermi="['hosp:hosp:export']">导出</el-button> |
| | | <el-button type="primary" icon="el-icon-download" size="mini" @click="handleExport" |
| | | v-hasPermi="['hosp:hosp:export']">导出</el-button> |
| | | </el-col> |
| | | <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> |
| | | </el-row> |
| | | |
| | | <el-table v-loading="loading" :data="hospList" @selection-change="handleSelectionChange" border |
| | | > |
| | | <el-table v-loading="loading" :data="hospList" @selection-change="handleSelectionChange" border> |
| | | <el-table-column type="selection" width="55" align="center" fixed /> |
| | | <el-table-column label="序号" align="center" prop="newID" width="50px" fixed="left"/> |
| | | <el-table-column label="院区名称" align="center" prop="hospAreaName" width="120px" :show-overflow-tooltip="true" fixed="left"/> |
| | | <!-- <el-table-column label="医疗机构ID" align="center" prop="hospid" /> --> |
| | | <!-- <el-table-column label="医疗机构名称" align="center" prop="hospName" /> --> |
| | | <el-table-column label="院区编码" align="center" prop="code" :show-overflow-tooltip="true"/> |
| | | <el-table-column label="五笔简码" align="center" prop="wbm" :show-overflow-tooltip="true"/> |
| | | <el-table-column label="拼音简码" align="center" prop="spell" :show-overflow-tooltip="true"/> |
| | | <!-- <el-table-column label="行政区划ID" align="center" prop="areaid" /> --> |
| | | <!-- <el-table-column label="行政区划名称" align="center" prop="areaName" /> --> |
| | | <el-table-column label="序号" align="center" prop="newID" width="50px" fixed="left" /> |
| | | <el-table-column label="院区名称" align="center" prop="hospAreaName" width="120px" :show-overflow-tooltip="true" |
| | | fixed="left" /> |
| | | <el-table-column label="院区编码" align="center" prop="code" :show-overflow-tooltip="true" /> |
| | | <el-table-column label="五笔简码" align="center" prop="wbm" :show-overflow-tooltip="true" /> |
| | | <el-table-column label="拼音简码" align="center" prop="spell" :show-overflow-tooltip="true" /> |
| | | <el-table-column label="主院区" align="center" prop="mainHospArea" :show-overflow-tooltip="true"> |
| | | <template slot-scope="scope"> |
| | | <dict-tag :options="dict.type.sys_yes_no" :value="scope.row.mainHospArea"/> |
| | | <dict-tag :options="dict.type.sys_yes_no" :value="scope.row.mainHospArea" /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="负责人" align="center" prop="principal" :show-overflow-tooltip="true"/> |
| | | <el-table-column label="负责人电话" align="center" prop="phone" :show-overflow-tooltip="true" width="120px"/> |
| | | <el-table-column label="编制床位" align="center" prop="plaitBed" :show-overflow-tooltip="true"/> |
| | | <el-table-column label="开放床位" align="center" prop="openBed" :show-overflow-tooltip="true"/> |
| | | <el-table-column label="负责人" align="center" prop="principal" :show-overflow-tooltip="true" /> |
| | | <el-table-column label="负责人电话" align="center" prop="phone" :show-overflow-tooltip="true" width="120px" /> |
| | | <el-table-column label="编制床位" align="center" prop="plaitBed" :show-overflow-tooltip="true" /> |
| | | <el-table-column label="开放床位" align="center" prop="openBed" :show-overflow-tooltip="true" /> |
| | | <el-table-column label="成立日期" align="center" prop="buildDate" width="120px" :show-overflow-tooltip="true"> |
| | | <template slot-scope="scope"> |
| | | <span>{{ parseTime(scope.row.buildDate, "{y}-{m}-{d}") }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true"/> |
| | | <el-table-column label="排序" align="center" prop="orderNum" width="50px" :show-overflow-tooltip="true"/> |
| | | <el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" /> |
| | | <el-table-column label="排序" align="center" prop="orderNum" width="50px" :show-overflow-tooltip="true" /> |
| | | <el-table-column label="数据状态" align="center" prop="effective" :show-overflow-tooltip="true"> |
| | | <template slot-scope="scope"> |
| | | <dict-tag :options="dict.type.dict_data_status" :value="scope.row.effective"/> |
| | | <dict-tag :options="dict.type.dict_data_status" :value="scope.row.effective" /> |
| | | </template> |
| | | </el-table-column> |
| | | <!-- <el-table-column label="创建人姓名" align="center" prop="createByName" /> --> |
| | | <!-- <el-table-column label="修改人姓名" align="center" prop="updateByName" /> --> |
| | | <!-- <el-table-column label="图片" align="center" prop="imgbase64" width="100"> |
| | | <el-table-column fixed="right" label="操作" align="center" class-name="small-padding fixed-width" width="80px"> |
| | | <template slot-scope="scope"> |
| | | <image-preview :src="scope.row.imgbase64" :width="50" :height="50" /> |
| | | </template> |
| | | </el-table-column> --> |
| | | <el-table-column |
| | | fixed="right" |
| | | label="操作" |
| | | align="center" |
| | | class-name="small-padding fixed-width" |
| | | width="80px" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-edit" |
| | | @click="handleUpdate(scope.row)" |
| | | v-hasPermi="['hosp:hosp:edit']" |
| | | title="修改" |
| | | ></el-button> |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-delete" |
| | | @click="handleDelete(scope.row)" |
| | | v-hasPermi="['hosp:hosp:remove']" |
| | | title="删除" |
| | | ></el-button> |
| | | <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" |
| | | v-hasPermi="['hosp:hosp:edit']" title="修改"></el-button> |
| | | <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" |
| | | v-hasPermi="['hosp:hosp:remove']" title="删除"></el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | |
| | | <div class="pag"> |
| | | <div class="pag1"> |
| | | <pagination |
| | | v-show="total > 0" |
| | | :total="total" |
| | | :page.sync="queryParams.pageNum" |
| | | :limit.sync="queryParams.pageSize" |
| | | @pagination="getList" |
| | | /> |
| | | <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" |
| | | :limit.sync="queryParams.pageSize" @pagination="getList" /> |
| | | </div> |
| | | </div> |
| | | |
| | | <!-- 添加或修改院区信息对话框 --> |
| | | <el-dialog |
| | | :title="title" |
| | | :visible.sync="open" |
| | | width="1000px" |
| | | append-to-body |
| | | > |
| | | <el-form |
| | | ref="form" |
| | | :model="form" |
| | | :rules="rules" |
| | | label-width="100px" |
| | | :inline="true" |
| | | > |
| | | <el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body> |
| | | <el-form ref="form" :model="form" :rules="rules" label-width="100px" :inline="true"> |
| | | <el-form-item label="院区名称" prop="hospAreaName"> |
| | | <el-input v-model="form.hospAreaName" placeholder="请输入院区名称" /> |
| | | </el-form-item> |
| | | <el-form-item label="院区编码" prop="code"> |
| | | <el-input v-model="form.code" placeholder="请输入院区编码" /> |
| | | </el-form-item> |
| | | <el-form-item label="主院区 " prop="mainHospArea"> |
| | | <el-select |
| | | v-model="form.mainHospArea" |
| | | placeholder="请选择是否主院区 0-不是 1-是" |
| | | style="width: 130px" |
| | | > |
| | | <el-option |
| | | v-for="dict in dict.type.sys_yes_no" |
| | | :key="dict.value" |
| | | :label="dict.label" |
| | | :value="dict.value" |
| | | ></el-option> |
| | | <el-form-item label="主院区" prop="mainHospArea"> |
| | | <el-select v-model="form.mainHospArea" placeholder="请选择是否主院区 0-不是 1-是" style="width: 130px"> |
| | | <el-option v-for="dict in dict.type.sys_yes_no" :key="dict.value" :label="dict.label" |
| | | :value="dict.value"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <!-- <el-form-item label="医疗机构ID" prop="hospid"> |
| | | <el-input v-model="form.hospid" placeholder="请输入医疗机构ID" /> |
| | | </el-form-item> --> |
| | | <el-form-item label="机构名称" prop="hospName"> |
| | | <el-select |
| | | v-model="form.hospid" |
| | | placeholder="请选择所在机构" |
| | | clearable |
| | | style="width: 200px" |
| | | filterable |
| | | > |
| | | <el-option |
| | | v-for="dict in orgList" |
| | | :key="dict.orgCnName" |
| | | :label="dict.orgCnName" |
| | | :value="dict.orgId" |
| | | /> |
| | | <el-select v-model="form.hospid" placeholder="请选择所在机构" clearable style="width: 200px" filterable> |
| | | <el-option v-for="dict in orgList" :key="dict.orgCnName" :label="dict.orgCnName" :value="dict.orgId" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <!-- <el-form-item label="五笔简码" prop="wbm"> |
| | | <el-input v-model="form.wbm" placeholder="请输入五笔简码" /> |
| | | </el-form-item> --> |
| | | <!-- <el-form-item label="拼音简码" prop="spell"> |
| | | <el-input v-model="form.spell" placeholder="请输入拼音简码" /> |
| | | </el-form-item> --> |
| | | <el-form-item label="区划名称" prop="areaid"> |
| | | <el-select |
| | | style="width: 200px" |
| | | v-model="form.areaid" |
| | | placeholder="请选择区划名称" |
| | | filterable |
| | | > |
| | | <el-option |
| | | v-for="dict in dict.type.dict_qhdm" |
| | | :key="dict.value" |
| | | :label="dict.label" |
| | | :value="dict.value" |
| | | /> |
| | | <el-select style="width: 200px" v-model="form.areaid" placeholder="请选择区划名称" filterable> |
| | | <el-option v-for="dict in dict.type.dict_qhdm" :key="dict.value" :label="dict.label" :value="dict.value" /> |
| | | </el-select> |
| | | <!-- <el-input v-model="form.areaid" placeholder="请输入行政区划名称" /> --> |
| | | </el-form-item> |
| | | <el-form-item label="负责人" prop="principal"> |
| | | <el-input v-model="form.principal" placeholder="请输入负责人" style="width:135px" /> |
| | | <el-input v-model="form.principal" placeholder="请输入负责人" style="width: 135px" /> |
| | | </el-form-item> |
| | | <el-form-item label="院区地址" prop="areaName"> |
| | | <el-input v-model="form.areaName" placeholder="请输入院区地址" style="width:510px" /> |
| | | <el-input v-model="form.areaName" placeholder="请输入院区地址" style="width: 510px" /> |
| | | </el-form-item> |
| | | <el-form-item label="负责人电话" prop="phone"> |
| | | <el-input v-model="form.phone" placeholder="请输入负责人电话" style="width:135px" /> |
| | | <el-input v-model="form.phone" placeholder="请输入负责人电话" style="width: 135px" /> |
| | | </el-form-item> |
| | | <el-form-item label="成立日期" prop="buildDate"> |
| | | <el-date-picker |
| | | clearable |
| | | v-model="form.buildDate" |
| | | type="date" |
| | | value-format="yyyy-MM-dd" |
| | | placeholder="请选择成立日期" |
| | | style="width: 200px" |
| | | > |
| | | <el-date-picker clearable v-model="form.buildDate" type="date" value-format="yyyy-MM-dd" placeholder="请选择成立日期" |
| | | style="width: 200px"> |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | <el-form-item label="编制床位数" prop="plaitBed"> |
| | | <el-input |
| | | v-model="form.plaitBed" |
| | | placeholder="请输入编制床位数" |
| | | style="width: 200px" |
| | | /> |
| | | <el-form-item label="排序" prop="orderNum"> |
| | | <el-input |
| | | v-model="form.orderNum" |
| | | placeholder="请输入排序" |
| | | style="width: 145px" |
| | | /> |
| | | </el-form-item> |
| | | <el-input v-model="form.plaitBed" placeholder="请输入编制床位数" style="width: 200px" /> |
| | | </el-form-item> |
| | | <el-form-item label="开放床位数" prop="openBed"> |
| | | <el-input v-model="form.openBed" placeholder="请输入开放床位数" style="width: 200px" /> |
| | | </el-form-item> |
| | | |
| | | <!-- <el-form-item label="数据状态(PT10.00.004)" prop="effective"> |
| | | <el-select |
| | | v-model="form.effective" |
| | | placeholder="请选择数据状态(PT10.00.004)" |
| | | > |
| | | <el-option |
| | | v-for="dict in dict.type.dict_data_status" |
| | | :key="dict.value" |
| | | :label="dict.label" |
| | | :value="dict.value" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> --> |
| | | <!-- <el-form-item label="创建人姓名" prop="createByName"> |
| | | <el-input |
| | | v-model="form.createByName" |
| | | placeholder="请输入创建人姓名" |
| | | /> |
| | | </el-form-item> --> |
| | | <!-- <el-form-item label="修改人姓名" prop="updateByName"> |
| | | <el-input |
| | | v-model="form.updateByName" |
| | | placeholder="请输入修改人姓名" |
| | | /> |
| | | </el-form-item> --> |
| | | <br /> |
| | | <el-form-item label="排序" prop="orderNum"> |
| | | <el-input v-model="form.orderNum" placeholder="请输入排序" style="width: 145px" /> |
| | | </el-form-item> |
| | | <el-form-item label="备注" prop="remark"> |
| | | <el-input |
| | | v-model="form.remark" |
| | | type="textarea" |
| | | placeholder="请输入内容" |
| | | :rows="2" |
| | | label-width="400px" |
| | | style="width: 820px" |
| | | resize="none" |
| | | ></el-input> |
| | | <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" :rows="2" style="width: 820px" resize="none"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="医院简介" prop="introduction"> |
| | | <editor v-model="form.introduction" :init="editorInit" :api-key="apiKey" style="width: 820px"></editor> |
| | | </el-form-item> |
| | | <el-form-item label="图片"> |
| | | <image-upload v-model="form.imgbase64" /> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { |
| | | listHosp, |
| | | getHosp, |
| | | delHosp, |
| | | addHosp, |
| | | updateHosp, |
| | | } from "@/api/hosp/hosp"; |
| | | import { listHosp, getHosp, delHosp, addHosp, updateHosp } from "@/api/hosp/hosp"; |
| | | import { listOrg } from "@/api/hosp/org"; |
| | | import Editor from '@tinymce/tinymce-vue'; |
| | | |
| | | export default { |
| | | name: "Hosp", |
| | | dicts: ["sys_yes_no", "dict_data_status", "dict_qhdm"], |
| | | components: { Editor }, |
| | | data() { |
| | | let checkPhoneNum = (rule, value, callback) => { |
| | | const pattern = /^1[3-9]\d{9}$/; |
| | | if (!value) { |
| | | return callback(new Error("请输入负责人电话")); |
| | | } |
| | | if (!pattern.test(value)) { |
| | | return callback(new Error("请输入正确的手机号")); |
| | | } |
| | | return callback(); |
| | | }; |
| | | |
| | | return { |
| | | // 遮罩层 |
| | | loading: true, |
| | | // 选中数组 |
| | | ids: [], |
| | | // 非单个禁用 |
| | | single: true, |
| | | // 非多个禁用 |
| | | multiple: true, |
| | | // 显示搜索条件 |
| | | showSearch: true, |
| | | // 总条数 |
| | | total: 0, |
| | | // 院区信息表格数据 |
| | | hospList: [], |
| | | // 机构信息表格数据 |
| | | orgList: [], |
| | | // 弹出层标题 |
| | | title: "", |
| | | // 是否显示弹出层 |
| | | open: false, |
| | | // 查询参数 |
| | | apiKey: '3ceaxd5ckw4te35xj38vj3p5rmmeyv0x8pq2yrr92rwdiqzp', // 替换为您的 TinyMCE API 密钥 |
| | | editorInit: { |
| | | height: 200, |
| | | menubar: false, |
| | | plugins: [ |
| | | 'advlist autolink lists link image charmap', |
| | | 'searchreplace visualblocks code fullscreen', |
| | | 'insertdatetime media table paste wordcount' |
| | | ], |
| | | toolbar: |
| | | 'undo redo | formatselect | bold italic underline | alignleft aligncenter alignright | bullist numlist | link image table | removeformat', |
| | | images_upload_handler: (blobInfo, success, failure) => { |
| | | const reader = new FileReader(); |
| | | reader.onload = () => success(reader.result); |
| | | reader.onerror = () => failure('图片上传失败'); |
| | | reader.readAsDataURL(blobInfo.blob()); |
| | | }, |
| | | content_style: 'body { font-family: Arial, sans-serif; font-size: 14px; }', |
| | | table_default_attributes: { border: 1 }, |
| | | language: 'zh_CN', |
| | | dialog_zindex: 9999, |
| | | fixed_toolbar_container: true, |
| | | inline: false, |
| | | relative_urls: false, |
| | | remove_script_host: false, |
| | | convert_urls: false, |
| | | valid_elements: '*[*]', // 允许所有 HTML 元素和属性 |
| | | extended_valid_elements: 'p,div,span,b,strong,i,em,u,strike,sup,sub,table,tr,td,th,ul,ol,li,h1,h2,h3,h4,h5,h6,br,hr,img[*],a[*]', // 扩展允许的元素 |
| | | }, |
| | | queryParams: { |
| | | pageNum: 1, |
| | | pageSize: 10, |
| | |
| | | openBed: null, |
| | | orderNum: null, |
| | | }, |
| | | // 表单参数 |
| | | form: {}, |
| | | // 表单校验 |
| | | form: { |
| | | introduction: '<p>请输入医院简介...</p>', // 默认值 |
| | | }, |
| | | rules: { |
| | | hospAreaName: [ |
| | | { required: true, message: "", trigger: "blur" }, |
| | | { required: true, message: "请输入院区名称", trigger: "blur" }, |
| | | ], |
| | | hospid: [ |
| | | { required: true, message: "", trigger: "blur" }, |
| | | ], |
| | | // hospName: [ |
| | | // { required: true, message: "医疗机构名称不能为空", trigger: "blur" }, |
| | | // ], |
| | | code: [ |
| | | { required: true, message: "", trigger: "blur" }, |
| | | ], |
| | | code: [{ required: true, message: "请输入院区编码", trigger: "blur" }], |
| | | mainHospArea: [ |
| | | { |
| | | required: true, |
| | | message: "", |
| | | trigger: "change", |
| | | }, |
| | | ], |
| | | createBy: [ |
| | | { required: true, message: "", trigger: "blur" }, |
| | | ], |
| | | createTime: [ |
| | | { required: true, message: "", trigger: "blur" }, |
| | | ], |
| | | // orderNum: [ |
| | | // { required: true, message: "排序不能为空", trigger: "blur" }, |
| | | // ], |
| | | effective: [ |
| | | { |
| | | required: true, |
| | | message: "", |
| | | trigger: "change", |
| | | }, |
| | | ], |
| | | createByName: [ |
| | | { required: true, message: "", trigger: "blur" }, |
| | | ], |
| | | updateByName: [ |
| | | { required: true, message: "", trigger: "blur" }, |
| | | ], |
| | | areaName: [ |
| | | { required: true, message: "", trigger: "blur" }, |
| | | { required: true, message: "请选择是否主院区", trigger: "change" }, |
| | | ], |
| | | principal: [ |
| | | { required: true, message: "", trigger: "blur" }, |
| | | { required: true, message: "请输入负责人", trigger: "blur" }, |
| | | ], |
| | | areaName: [ |
| | | { required: true, message: "请输入院区地址", trigger: "blur" }, |
| | | ], |
| | | phone: [ |
| | | { required: true, message: "", trigger: "blur" }, |
| | | { required: true, validator: checkPhoneNum, trigger: "blur" }, |
| | | ], |
| | | introduction: [ |
| | | { required: true, message: "请输入医院简介", trigger: "blur" }, |
| | | { validator: (rule, value, callback) => { |
| | | if (!value || value === '<p>请输入医院简介...</p>') { |
| | | callback(new Error("医院简介不能为空")); |
| | | } else { |
| | | callback(); |
| | | } |
| | | }, trigger: "blur" } |
| | | ], |
| | | }, |
| | | }; |
| | |
| | | this.getListOrg(); |
| | | }, |
| | | methods: { |
| | | /** 查询院区信息列表 */ |
| | | // 检测字符串是否为有效的 Base64 编码 |
| | | isBase64(str) { |
| | | if (!str || typeof str !== 'string') return false; |
| | | // Base64 字符串只包含 A-Z, a-z, 0-9, +, /, =,且长度通常为 4 的倍数 |
| | | const base64Regex = /^[A-Za-z0-9+/=]+$/; |
| | | if (!base64Regex.test(str)) return false; |
| | | // 进一步验证是否可以解码 |
| | | try { |
| | | // 检查长度是否为 4 的倍数(考虑填充字符 =) |
| | | if (str.length % 4 !== 0) return false; |
| | | // 尝试解码 |
| | | const decoded = atob(str); |
| | | // 验证解码后是否可以重新编码为原字符串 |
| | | return btoa(decoded) === str; |
| | | } catch (e) { |
| | | return false; |
| | | } |
| | | }, |
| | | // 解码 Base64,处理 Unicode 字符 |
| | | decodeBase64(str) { |
| | | try { |
| | | // 替换 URL-safe Base64 字符(如果后端使用了 URL-safe 编码) |
| | | str = str.replace(/-/g, '+').replace(/_/g, '/'); |
| | | // 使用 atob 解码 |
| | | const decoded = atob(str); |
| | | // 将 Latin1 字符串转换为 UTF-8 |
| | | return decodeURIComponent(escape(decoded)); |
| | | } catch (e) { |
| | | console.error("Base64 解码失败:", e); |
| | | return null; |
| | | } |
| | | }, |
| | | // 编码为 Base64,处理 Unicode 字符 |
| | | encodeBase64(str) { |
| | | try { |
| | | // 将 UTF-8 字符串转换为 Latin1 编码 |
| | | return btoa(unescape(encodeURIComponent(str))); |
| | | } catch (e) { |
| | | console.error("Base64 编码失败:", e); |
| | | return null; |
| | | } |
| | | }, |
| | | getList() { |
| | | this.loading = true; |
| | | listHosp(this.queryParams).then((response) => { |
| | |
| | | this.loading = false; |
| | | }); |
| | | }, |
| | | /** 查询机构信息列表 */ |
| | | getListOrg() { |
| | | listOrg(this.queryParams).then((response) => { |
| | | this.orgList = response.rows; |
| | | }); |
| | | }, |
| | | // 取消按钮 |
| | | cancel() { |
| | | this.open = false; |
| | | this.reset(); |
| | | }, |
| | | // 表单重置 |
| | | reset() { |
| | | this.form = { |
| | | hospAreaId: null, |
| | |
| | | updateByName: null, |
| | | imgbase64: null, |
| | | deleted: null, |
| | | introduction: '<p>请输入医院简介...</p>', // 重置时恢复默认值 |
| | | }; |
| | | this.resetForm("form"); |
| | | }, |
| | | /** 搜索按钮操作 */ |
| | | handleQuery() { |
| | | this.queryParams.pageNum = 1; |
| | | this.getList(); |
| | | }, |
| | | /** 重置按钮操作 */ |
| | | resetQuery() { |
| | | this.resetForm("queryForm"); |
| | | this.handleQuery(); |
| | | }, |
| | | // 多选框选中数据 |
| | | handleSelectionChange(selection) { |
| | | this.ids = selection.map((item) => item.hospAreaId); |
| | | this.single = selection.length !== 1; |
| | | this.multiple = !selection.length; |
| | | }, |
| | | /** 新增按钮操作 */ |
| | | handleAdd() { |
| | | this.reset(); |
| | | this.open = true; |
| | | this.title = "分院信息维护"; |
| | | }, |
| | | /** 修改按钮操作 */ |
| | | handleUpdate(row) { |
| | | this.reset(); |
| | | const hospAreaId = row.hospAreaId || this.ids; |
| | | getHosp(hospAreaId).then((response) => { |
| | | this.form = response.data; |
| | | console.log("原始 introduction:", response.data.introduction); // 调试输出 |
| | | if (this.form.introduction) { |
| | | // 检测是否为 Base64 编码 |
| | | if (this.isBase64(this.form.introduction)) { |
| | | const decoded = this.decodeBase64(this.form.introduction); |
| | | if (decoded) { |
| | | this.form.introduction = decoded; |
| | | console.log("解码后的 introduction:", this.form.introduction); // 调试输出 |
| | | } else { |
| | | this.form.introduction = '<p>无法解码医院简介,请检查数据</p>'; |
| | | } |
| | | } else { |
| | | // 如果不是 Base64,假设是 HTML 或纯文本,直接使用 |
| | | this.form.introduction = this.form.introduction; |
| | | } |
| | | } else { |
| | | this.form.introduction = '<p>请输入医院简介...</p>'; |
| | | } |
| | | this.open = true; |
| | | this.title = "分院信息维护"; |
| | | }); |
| | | }, |
| | | /** 提交按钮 */ |
| | | submitForm() { |
| | | this.$refs["form"].validate((valid) => { |
| | | if (valid) { |
| | | if (this.form.hospAreaId != null) { |
| | | updateHosp(this.form).then((response) => { |
| | | const formData = { ...this.form }; |
| | | // 如果后端要求 Base64 编码 |
| | | if (formData.introduction) { |
| | | const encoded = this.encodeBase64(formData.introduction); |
| | | if (encoded) { |
| | | formData.introduction = encoded; |
| | | } else { |
| | | this.$modal.msgError("医院简介编码失败,请检查内容"); |
| | | return; |
| | | } |
| | | } |
| | | if (formData.hospAreaId != null) { |
| | | updateHosp(formData).then((response) => { |
| | | this.$modal.msgSuccess("修改成功"); |
| | | this.open = false; |
| | | this.getList(); |
| | | }); |
| | | } else { |
| | | addHosp(this.form).then((response) => { |
| | | addHosp(formData).then((response) => { |
| | | this.$modal.msgSuccess("新增成功"); |
| | | this.open = false; |
| | | this.getList(); |
| | |
| | | } |
| | | }); |
| | | }, |
| | | /** 删除按钮操作 */ |
| | | handleDelete(row) { |
| | | const hospAreaIds = row.hospAreaId || this.ids; |
| | | this.$modal |
| | |
| | | }) |
| | | .catch(() => {}); |
| | | }, |
| | | /** 导出按钮操作 */ |
| | | handleExport() { |
| | | this.download( |
| | | "hosp/hosp/export", |
| | | { |
| | | ...this.queryParams, |
| | | }, |
| | | `hosp_${new Date().getList()}.xlsx` |
| | | `hosp_${new Date().getTime()}.xlsx` |
| | | ); |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | <style scoped> |
| | | |
| | | <style lang="scss"> |
| | | .pag { |
| | | width: 100%; |
| | | display: flex; |
| | | justify-content: center; |
| | | } |
| | | |
| | | .pag1 { |
| | | width: 30%; |
| | | } |
| | | </style> |
| | | |
| | | .app-container { |
| | | padding: 20px; |
| | | } |
| | | |
| | | .el-form-item { |
| | | margin-bottom: 10px; |
| | | } |
| | | |
| | | /* 调整 TinyMCE 编辑器样式 */ |
| | | .tox-tinymce { |
| | | border: 1px solid #dcdfe6; |
| | | border-radius: 4px; |
| | | } |
| | | |
| | | /* 提高 TinyMCE 子对话框的 z-index */ |
| | | .tox-dialog-wrap { |
| | | z-index: 9999 !important; /* 确保高于 el-dialog 的默认 z-index */ |
| | | } |
| | | |
| | | /* 提高 TinyMCE 下拉菜单的 z-index */ |
| | | .tox-menu { |
| | | z-index: 9999 !important; |
| | | } |
| | | |
| | | /* 提高 TinyMCE 工具栏的 z-index */ |
| | | .tox-toolbar { |
| | | z-index: 9999 !important; |
| | | } |
| | | |
| | | /* 提高 TinyMCE 状态栏的 z-index */ |
| | | .tox-statusbar { |
| | | z-index: 9999 !important; |
| | | } |
| | | |
| | | /* 确保所有 TinyMCE 相关元素都有足够高的 z-index */ |
| | | .tox-tinymce-aux { |
| | | z-index: 9999 !important; |
| | | } |
| | | </style> |