prxhap34i
/
test
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request '2' (#8) from cp into develop

Browse Source
develop
prxhap34i 1 month ago
parent 6413bf9621 e1fa06e1b5
commit ae12aa7b83
10 changed files with 1636 additions and 2508 deletions
Show Stats Download Patch File Download Diff File

138
src/main/java/com/entity/model/YishengModel.java
Unescape View File

@ -204,5 +204,139 @@ public class YishengModel implements Serializable {
return zhiweiTypes;
}
/**
* 设置职位类型
/**
* 设置职位类型
* @param zhiweiTypes 职位类型编码
*/
public void setZhiweiTypes(Integer zhiweiTypes) {
this.zhiweiTypes = zhiweiTypes;
}
/**
* 获取职称
* @return 职称
*/
public String getYishengZhichneg() {
return yishengZhichneg;
}
/**
* 设置职称
* @param yishengZhichneg 职称
*/
public void setYishengZhichneg(String yishengZhichneg) {
this.yishengZhichneg = yishengZhichneg;
}
/**
* 获取医生头像路径
* @return 头像路径
*/
public String getYishengPhoto() {
return yishengPhoto;
}
/**
* 设置医生头像路径
* @param yishengPhoto 头像路径
*/
public void setYishengPhoto(String yishengPhoto) {
this.yishengPhoto = yishengPhoto;
}
/**
* 获取联系方式
* @return 联系方式
*/
public String getYishengPhone() {
return yishengPhone;
}
/**
* 设置联系方式
* @param yishengPhone 联系方式
*/
public void setYishengPhone(String yishengPhone) {
this.yishengPhone = yishengPhone;
}
/**
* 获取挂号须知
* @return 挂号须知内容
*/
public String getYishengGuahao() {
return yishengGuahao;
}
/**
* 设置挂号须知
* @param yishengGuahao 挂号须知内容
*/
public void setYishengGuahao(String yishengGuahao) {
this.yishengGuahao = yishengGuahao;
}
/**
* 获取邮箱
* @return 邮箱地址
*/
public String getYishengEmail() {
return yishengEmail;
}
/**
* 设置邮箱
* @param yishengEmail 邮箱地址
*/
public void setYishengEmail(String yishengEmail) {
this.yishengEmail = yishengEmail;
}
/**
* 获取挂号价格
* @return 挂号价格
*/
public Double getYishengNewMoney() {
return yishengNewMoney;
}
/**
* 设置挂号价格
* @param yishengNewMoney 挂号价格
*/
public void setYishengNewMoney(Double yishengNewMoney) {
this.yishengNewMoney = yishengNewMoney;
}
/**
* 获取履历介绍
* @return 履历介绍内容
*/
public String getYishengContent() {
return yishengContent;
}
/**
* 设置履历介绍
* @param yishengContent 履历介绍内容
*/
public void setYishengContent(String yishengContent) {
this.yishengContent = yishengContent;
}
/**
* 获取创建时间
* @return 创建时间
*/
public Date getCreateTime() {
return createTime;
}
/**
* 设置创建时间
* @param createTime 创建时间
*/
public void setCreateTime(Date createTime) {
this.createTime = createTime;
}
}

111
src/main/java/com/entity/view/YishengView.java
Unescape View File

@ -13,69 +13,82 @@ import java.util.Date;
* 医生
* 后端返回视图实体辅助类
* （通常后端关联的表或者自定义的字段需要返回使用）
* 该类继承自 YishengEntity，用于扩展或修改返回给前端的实体数据结构
*/
@TableName("yisheng")
@TableName("yisheng") // 表明该实体类对应的数据库表名为 "yisheng"，这里可能是为了保持与基础实体类的一致性或者有特定的 MyBatis-Plus 相关用途
public class YishengView extends YishengEntity implements Serializable {
private static final long serialVersionUID = 1L;
/**
* 科室的值
*/
private String yishengValue;
/**
* 职位的值
*/
private String zhiweiValue;
private static final long serialVersionUID = 1L;
// 序列化版本号，用于在对象序列化和反序列化过程中保持版本一致性
/**
* 科室的值
* 这里定义了一个额外的字段，用于存储科室相关的具体值（可能是科室名称等更详细信息，与 YishengEntity 中的科室字段可能有所区别）
*/
private String yishengValue;
/**
* 职位的值
* 同样定义了一个额外的字段，用于存储职位相关的具体值（可能是职位名称等更详细信息，与 YishengEntity 中的职位字段可能有所区别）
*/
private String zhiweiValue;
/**
* 无参构造函数
* 用于创建一个空的 YishengView 对象
*/
public YishengView() {
}
/**
* 带参构造函数
* 接收一个 YishengEntity 对象，将其属性复制到当前 YishengView 对象中
*
* @param yishengEntity YishengEntity 类型的对象，其属性将被复制到当前对象
*/
public YishengView(YishengEntity yishengEntity) {
try {
// 使用 BeanUtils 工具类将 YishengEntity 对象的属性复制到当前 YishengView 对象
BeanUtils.copyProperties(this, yishengEntity);
} catch (IllegalAccessException | InvocationTargetException e) {
// TODO Auto-generated catch block
// 如果在属性复制过程中出现非法访问或调用目标异常，打印异常堆栈信息
e.printStackTrace();
}
}
/**
* 获取科室的值
*
* @return 返回存储的科室的值
*/
public String getYishengValue() {
return yishengValue;
}
/**
* 设置科室的值
*
* @param yishengValue 要设置的科室的值
*/
public void setYishengValue(String yishengValue) {
this.yishengValue = yishengValue;
}
/**
* 获取： 科室的值
*/
public String getYishengValue() {
return yishengValue;
}
/**
* 设置： 科室的值
*/
public void setYishengValue(String yishengValue) {
this.yishengValue = yishengValue;
}
/**
* 获取： 职位的值
*/
public String getZhiweiValue() {
return zhiweiValue;
}
/**
* 设置： 职位的值
*/
public void setZhiweiValue(String zhiweiValue) {
this.zhiweiValue = zhiweiValue;
}
/**
* 获取职位的值
*
* @return 返回存储的职位的值
*/
public String getZhiweiValue() {
return zhiweiValue;
}
}
/**
* 设置职位的值
*
* @param zhiweiValue 要设置的职位的值
*/
public void setZhiweiValue(String zhiweiValue) {
this.zhiweiValue = zhiweiValue;
}
}

283
src/main/java/com/entity/vo/YishengVO.java
Unescape View File

@ -13,358 +13,389 @@ import java.io.Serializable;
* 医生
* 手机端接口返回实体辅助类
* （主要作用去除一些不必要的字段）
* 该类用于定义返回给手机端接口的数据结构，通过定义特定的属性，控制返回给客户端的数据内容，
* 避免返回不必要的敏感或无用信息。
*/
@TableName("yisheng")
@TableName("yisheng") // 声明该实体类对应的数据库表名为 "yisheng"，用于 MyBatis-Plus 的相关操作
public class YishengVO implements Serializable {
private static final long serialVersionUID = 1L;
// 序列化版本号，用于保证在对象序列化和反序列化过程中的兼容性
/**
* 主键
* 对应数据库表中记录的唯一标识字段
*/
@TableField(value = "id")
private Integer id;
/**
* 医生工号
* 用于唯一标识医生的编号
*/
@TableField(value = "yisheng_uuid_number")
private String yishengUuidNumber;
/**
* 账户
* 医生登录系统使用的账户名
*/
@TableField(value = "username")
private String username;
/**
* 密码
* 医生登录系统使用的密码
* 注意：通常密码不应该返回给客户端，这里可能存在安全风险，需要根据实际情况处理
*/
@TableField(value = "password")
private String password;
/**
* 医生名称
* 医生的真实姓名
*/
@TableField(value = "yisheng_name")
private String yishengName;
/**
* 科室
* 医生所属的科室，用整数表示科室编号
*/
@TableField(value = "yisheng_types")
private Integer yishengTypes;
/**
* 职位
* 医生的职位，用整数表示职位编号
*/
@TableField(value = "zhiwei_types")
private Integer zhiweiTypes;
/**
* 职称
* 医生的职称信息
*/
@TableField(value = "yisheng_zhichneg")
private String yishengZhichneg;
/**
* 医生头像
* 医生头像的存储路径或链接
*/
@TableField(value = "yisheng_photo")
private String yishengPhoto;
/**
* 联系方式
* 医生的联系电话号码
*/
@TableField(value = "yisheng_phone")
private String yishengPhone;
/**
* 挂号须知
* 关于该医生挂号的相关注意事项
*/
@TableField(value = "yisheng_guahao")
private String yishengGuahao;
/**
* 邮箱
* 医生的电子邮箱地址
*/
@TableField(value = "yisheng_email")
private String yishengEmail;
/**
* 挂号价格
* 患者挂该医生号所需支付的费用
*/
@TableField(value = "yisheng_new_money")
private Double yishengNewMoney;
/**
* 履历介绍
* 医生的工作履历、专业技能等相关介绍信息
*/
@TableField(value = "yisheng_content")
private String yishengContent;
/**
* 创建时间 show1 show2 photoShow
* 该字段表示医生记录的创建时间，通过注解进行日期格式的处理
*/
@JsonFormat(locale="zh", timezone="GMT+8", pattern="yyyy-MM-dd HH:mm:ss")
@DateTimeFormat
@JsonFormat(locale = "zh", timezone = "GMT+8", pattern = "yyyy-MM-dd HH:mm:ss")
@DateTimeFormat
@TableField(value = "create_time")
private Date createTime;
/**
* 设置：主键
*/
* 获取主键的值
*
* @return 主键的值
*/
public Integer getId() {
return id;
}
/**
* 获取：主键
*/
* 设置主键的值
*
* @param id 要设置的主键值
*/
public void setId(Integer id) {
this.id = id;
}
/**
* 设置：医生工号
*/
* 获取医生工号的值
*
* @return 医生工号的值
*/
public String getYishengUuidNumber() {
return yishengUuidNumber;
}
/**
* 获取：医生工号
*/
* 设置医生工号的值
*
* @param yishengUuidNumber 要设置的医生工号值
*/
public void setYishengUuidNumber(String yishengUuidNumber) {
this.yishengUuidNumber = yishengUuidNumber;
}
/**
* 设置：账户
*/
* 获取账户的值
*
* @return 账户的值
*/
public String getUsername() {
return username;
}
/**
* 获取：账户
*/
* 设置账户的值
*
* @param username 要设置的账户值
*/
public void setUsername(String username) {
this.username = username;
}
/**
* 设置：密码
*/
* 获取密码的值
*
* @return 密码的值
*/
public String getPassword() {
return password;
}
/**
* 获取：密码
*/
* 设置密码的值
*
* @param password 要设置的密码值
*/
public void setPassword(String password) {
this.password = password;
}
/**
* 设置：医生名称
*/
* 获取医生名称的值
*
* @return 医生名称的值
*/
public String getYishengName() {
return yishengName;
}
/**
* 获取：医生名称
*/
* 设置医生名称的值
*
* @param yishengName 要设置的医生名称值
*/
public void setYishengName(String yishengName) {
this.yishengName = yishengName;
}
/**
* 设置：科室
*/
* 获取科室的值
*
* @return 科室的值
*/
public Integer getYishengTypes() {
return yishengTypes;
}
/**
* 获取：科室
*/
* 设置科室的值
*
* @param yishengTypes 要设置的科室值
*/
public void setYishengTypes(Integer yishengTypes) {
this.yishengTypes = yishengTypes;
}
/**
* 设置：职位
*/
* 获取职位的值
*
* @return 职位的值
*/
public Integer getZhiweiTypes() {
return zhiweiTypes;
}
/**
* 获取：职位
*/
* 设置职位的值
*
* @param zhiweiTypes 要设置的职位值
*/
public void setZhiweiTypes(Integer zhiweiTypes) {
this.zhiweiTypes = zhiweiTypes;
}
/**
* 设置：职称
*/
* 获取职称的值
*
* @return 职称的值
*/
public String getYishengZhichneg() {
return yishengZhichneg;
}
/**
* 获取：职称
*/
* 设置职称的值
*
* @param yishengZhichneg 要设置的职称值
*/
public void setYishengZhichneg(String yishengZhichneg) {
this.yishengZhichneg = yishengZhichneg;
}
/**
* 设置：医生头像
*/
* 获取医生头像的值
*
* @return 医生头像的值
*/
public String getYishengPhoto() {
return yishengPhoto;
}
/**
* 获取：医生头像
*/
* 设置医生头像的值
*
* @param yishengPhoto 要设置的医生头像值
*/
public void setYishengPhoto(String yishengPhoto) {
this.yishengPhoto = yishengPhoto;
}
/**
* 设置：联系方式
*/
* 获取联系方式的值
*
* @return 联系方式的值
*/
public String getYishengPhone() {
return yishengPhone;
}
/**
* 获取：联系方式
*/
* 设置联系方式的值
*
* @param yishengPhone 要设置的联系方式值
*/
public void setYishengPhone(String yishengPhone) {
this.yishengPhone = yishengPhone;
}
/**
* 设置：挂号须知
*/
* 获取挂号须知的值
*
* @return 挂号须知的值
*/
public String getYishengGuahao() {
return yishengGuahao;
}
/**
* 获取：挂号须知
*/
* 设置挂号须知的值
*
* @param yishengGuahao 要设置的挂号须知值
*/
public void setYishengGuahao(String yishengGuahao) {
this.yishengGuahao = yishengGuahao;
}
/**
* 设置：邮箱
*/
* 获取邮箱的值
*
* @return 邮箱的值
*/
public String getYishengEmail() {
return yishengEmail;
}
/**
* 获取：邮箱
*/
* 设置邮箱的值
*
* @param yishengEmail 要设置的邮箱值
*/
public void setYishengEmail(String yishengEmail) {
this.yishengEmail = yishengEmail;
}
/**
* 设置：挂号价格
*/
* 获取挂号价格的值
*
* @return 挂号价格的值
*/
public Double getYishengNewMoney() {
return yishengNewMoney;
}
/**
* 获取：挂号价格
*/
* 设置挂号价格的值
*
* @param yishengNewMoney 要设置的挂号价格值
*/
public void setYishengNewMoney(Double yishengNewMoney) {
this.yishengNewMoney = yishengNewMoney;
}
/**
* 设置：履历介绍
*/
* 获取履历介绍的值
*
* @return 履历介绍的值
*/
public String getYishengContent() {
return yishengContent;
}
/**
* 获取：履历介绍
*/
* 设置履历介绍的值
*
* @param yishengContent 要设置的履历介绍值
*/
public void setYishengContent(String yishengContent) {
this.yishengContent = yishengContent;
}
/**
* 设置：创建时间 show1 show2 photoShow
*/
* 获取创建时间的值
*
* @return 创建时间的值
*/
public Date getCreateTime() {
return createTime;
}
/**
* 获取：创建时间 show1 show2 photoShow
*/
* 设置创建时间的值
*
* @param createTime 要设置的创建时间值
*/
public void setCreateTime(Date createTime) {
this.createTime = createTime;
}
}
}

37
src/main/java/com/service/impl/YishengServiceImpl.java
Unescape View File

@ -19,21 +19,36 @@ import com.entity.view.YishengView;
/**
* 医生 服务实现类
* 该类实现了 YishengService 接口，用于处理医生相关业务逻辑，继承自 MyBatis-Plus 的 ServiceImpl 类
*/
@Service("yishengService")
@Transactional
@Service("yishengService") // 声明这是一个 Spring 服务组件，名称为 "yishengService"
@Transactional // 开启事务管理，确保数据库操作的原子性
public class YishengServiceImpl extends ServiceImpl<YishengDao, YishengEntity> implements YishengService {
/**
* 分页查询医生信息
*
* @param params 包含分页和查询条件的参数映射，可能包含 "page"（页码）、"limit"（每页记录数）等信息
* @return 返回封装好的分页信息对象 PageUtils
*/
@Override
public PageUtils queryPage(Map<String,Object> params) {
if(params != null && (params.get("limit") == null || params.get("page") == null)){
params.put("page","1");
params.put("limit","10");
public PageUtils queryPage(Map<String, Object> params) {
// 检查参数是否为空，并且判断是否缺少 "limit" 或 "page" 参数
if (params != null && (params.get("limit") == null || params.get("page") == null)) {
// 如果缺少 "page" 参数，将其默认设置为 "1"，表示第一页
params.put("page", "1");
// 如果缺少 "limit" 参数，将其默认设置为 "10"，表示每页显示 10 条记录
params.put("limit", "10");
}
Page<YishengView> page =new Query<YishengView>(params).getPage();
page.setRecords(baseMapper.selectListView(page,params));
return new PageUtils(page);
}
// 根据传入的参数创建一个分页对象 Page<YishengView>，用于存储查询结果
Page<YishengView> page = new Query<YishengView>(params).getPage();
// 调用 baseMapper（即 YishengDao）的 selectListView 方法，根据分页对象和查询参数进行分页查询
// 并将查询结果记录设置到分页对象中
page.setRecords(baseMapper.selectListView(page, params));
}
// 将分页对象封装到 PageUtils 中，方便返回给调用者
return new PageUtils(page);
}
}

971
src/main/resources/admin/admin/src/views/modules/guahao/add-or-update.vue
Unescape View File

@ -1,698 +1,283 @@
<template>
<div class="addEdit-block">
<el-form
class="detail-form-content"
ref="ruleForm"
:model="ruleForm"
:rules="rules"
label-width="80px"
:style="{backgroundColor:addEditForm.addEditBoxColor}">
<el-row>
<el-col :span="12" v-if="sessionTable !='yisheng'">
<el-form-item class="select" v-if="type!='info'" label="医生" prop="yishengId">
<el-select v-model="ruleForm.yishengId" :disabled="ro.yishengId" filterable placeholder="请选择医生" @change="yishengChange">
<el-option
v-for="(item,index) in yishengOptions"
v-bind:key="item.id"
:label="item.yishengName"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<div class="addEdit-block">
<!-- 使用 Element UI 的表单组件，绑定表单数据和验证规则 -->
<el-form
class="detail-form-content"
ref="ruleForm"
:model="ruleForm"
:rules="rules"
label-width="80px"
:style="{backgroundColor:addEditForm.addEditBoxColor}">
<!-- 使用 Element UI 的行组件 -->
<el-row>
<!-- 当 sessionTable 不是 'yisheng' 时显示该列 -->
<el-col :span="12" v-if="sessionTable!='yisheng'">
<!-- 当 type 不是 'info' 时显示该表单域，用于选择医生 -->
<el-form-item class="select" v-if="type!='info'" label="医生" prop="yishengId">
<el-select v-model="ruleForm.yishengId" :disabled="ro.yishengId" filterable placeholder="请选择医生" @change="yishengChange">
<!-- 循环渲染医生选项 -->
<el-option
v-for="(item,index) in yishengOptions"
v-bind:key="item.id"
:label="item.yishengName"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" v-if="sessionTable !='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="医生工号" prop="yishengUuidNumber">
<el-input v-model="yishengForm.yishengUuidNumber"
placeholder="医生工号" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="医生工号" prop="yishengUuidNumber">
<el-input v-model="ruleForm.yishengUuidNumber"
placeholder="医生工号" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable !='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="医生名称" prop="yishengName">
<el-input v-model="yishengForm.yishengName"
placeholder="医生名称" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="医生名称" prop="yishengName">
<el-input v-model="ruleForm.yishengName"
placeholder="医生名称" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable !='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="科室" prop="yishengValue">
<el-input v-model="yishengForm.yishengValue"
placeholder="科室" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="科室" prop="yishengValue">
<el-input v-model="ruleForm.yishengValue"
placeholder="科室" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable !='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="职位" prop="zhiweiValue">
<el-input v-model="yishengForm.zhiweiValue"
placeholder="职位" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="职位" prop="zhiweiValue">
<el-input v-model="ruleForm.zhiweiValue"
placeholder="职位" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable !='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="职称" prop="yishengZhichneg">
<el-input v-model="yishengForm.yishengZhichneg"
placeholder="职称" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="职称" prop="yishengZhichneg">
<el-input v-model="ruleForm.yishengZhichneg"
placeholder="职称" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="24" v-if="sessionTable !='yisheng' ">
<el-form-item class="upload" v-if="type!='info' && !ro.yishengPhoto" label="医生头像" prop="yishengPhoto">
<img style="margin-right:20px;" v-bind:key="index" v-for="(item,index) in (yishengForm.yishengPhoto || '').split(',')" :src="item" width="100" height="100">
</el-form-item>
<div v-else>
<el-form-item v-if="ruleForm.yishengPhoto" label="医生头像" prop="yishengPhoto">
<img style="margin-right:20px;" v-bind:key="index" v-for="(item,index) in (ruleForm.yishengPhoto || '').split(',')" :src="item" width="100" height="100">
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable !='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="联系方式" prop="yishengPhone">
<el-input v-model="yishengForm.yishengPhone"
placeholder="联系方式" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="联系方式" prop="yishengPhone">
<el-input v-model="ruleForm.yishengPhone"
placeholder="联系方式" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable !='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="挂号须知" prop="yishengGuahao">
<el-input v-model="yishengForm.yishengGuahao"
placeholder="挂号须知" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="挂号须知" prop="yishengGuahao">
<el-input v-model="ruleForm.yishengGuahao"
placeholder="挂号须知" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable !='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="邮箱" prop="yishengEmail">
<el-input v-model="yishengForm.yishengEmail"
placeholder="邮箱" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="邮箱" prop="yishengEmail">
<el-input v-model="ruleForm.yishengEmail"
placeholder="邮箱" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable !='yonghu'">
<el-form-item class="select" v-if="type!='info'" label="用户" prop="yonghuId">
<el-select v-model="ruleForm.yonghuId" :disabled="ro.yonghuId" filterable placeholder="请选择用户" @change="yonghuChange">
<el-option
v-for="(item,index) in yonghuOptions"
v-bind:key="item.id"
:label="item.yonghuName"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" v-if="sessionTable !='yonghu' ">
<el-form-item class="input" v-if="type!='info'" label="用户姓名" prop="yonghuName">
<el-input v-model="yonghuForm.yonghuName"
placeholder="用户姓名" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="用户姓名" prop="yonghuName">
<el-input v-model="ruleForm.yonghuName"
placeholder="用户姓名" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="24" v-if="sessionTable !='yonghu' ">
<el-form-item class="upload" v-if="type!='info' && !ro.yonghuPhoto" label="头像" prop="yonghuPhoto">
<img style="margin-right:20px;" v-bind:key="index" v-for="(item,index) in (yonghuForm.yonghuPhoto || '').split(',')" :src="item" width="100" height="100">
</el-form-item>
<div v-else>
<el-form-item v-if="ruleForm.yonghuPhoto" label="头像" prop="yonghuPhoto">
<img style="margin-right:20px;" v-bind:key="index" v-for="(item,index) in (ruleForm.yonghuPhoto || '').split(',')" :src="item" width="100" height="100">
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable !='yonghu' ">
<el-form-item class="input" v-if="type!='info'" label="用户手机号" prop="yonghuPhone">
<el-input v-model="yonghuForm.yonghuPhone"
placeholder="用户手机号" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="用户手机号" prop="yonghuPhone">
<el-input v-model="ruleForm.yonghuPhone"
placeholder="用户手机号" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable !='yonghu' ">
<el-form-item class="input" v-if="type!='info'" label="用户身份证号" prop="yonghuIdNumber">
<el-input v-model="yonghuForm.yonghuIdNumber"
placeholder="用户身份证号" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="用户身份证号" prop="yonghuIdNumber">
<el-input v-model="ruleForm.yonghuIdNumber"
placeholder="用户身份证号" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable !='yonghu' ">
<el-form-item class="input" v-if="type!='info'" label="邮箱" prop="yonghuEmail">
<el-input v-model="yonghuForm.yonghuEmail"
placeholder="邮箱" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="邮箱" prop="yonghuEmail">
<el-input v-model="ruleForm.yonghuEmail"
placeholder="邮箱" readonly></el-input>
</el-form-item>
</div>
</el-col>
<input id="updateId" name="id" type="hidden">
<input id="yishengId" name="yishengId" type="hidden">
<input id="yonghuId" name="yonghuId" type="hidden">
<el-col :span="12">
<el-form-item class="input" v-if="type!='info'" label="就诊识别码" prop="guahaoUuinNumber">
<el-input v-model="ruleForm.guahaoUuinNumber"
placeholder="就诊识别码" clearable :readonly="ro.guahaoUuinNumber"></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="就诊识别码" prop="guahaoUuinNumber">
<el-input v-model="ruleForm.guahaoUuinNumber"
placeholder="就诊识别码" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="24">
<el-form-item v-if="type!='info'" class="input" label="挂号时间" prop="guahaoTime">
<el-date-picker
value-format="yyyy-MM-dd"
v-model="ruleForm.guahaoTime"
type="date"
placeholder="挂号时间"
:disabled="ro.guahaoTime">
</el-date-picker>
</el-form-item>
<div v-else>
<el-form-item v-if="ruleForm.guahaoTime" label="挂号时间" prop="guahaoTime">
<span v-html="ruleForm.guahaoTime"></span>
</el-form-item>
</div>
</el-col>
<el-col :span="12">
<el-form-item class="select" v-if="type!='info'" label="时间类型" prop="guahaoTypes">
<el-select v-model="ruleForm.guahaoTypes" :disabled="ro.guahaoTypes" placeholder="请选择时间类型">
<el-option
v-for="(item,index) in guahaoTypesOptions"
v-bind:key="item.codeIndex"
:label="item.indexName"
:value="item.codeIndex">
</el-option>
</el-select>
</el-form-item>
<div v-else>
<el-form-item class="input" label="时间类型" prop="guahaoValue">
<el-input v-model="ruleForm.guahaoValue"
placeholder="时间类型" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12">
<el-form-item class="select" v-if="type!='info'" label="挂号状态" prop="guahaoStatusTypes">
<el-select v-model="ruleForm.guahaoStatusTypes" :disabled="ro.guahaoStatusTypes" placeholder="请选择挂号状态">
<el-option
v-for="(item,index) in guahaoStatusTypesOptions"
v-bind:key="item.codeIndex"
:label="item.indexName"
:value="item.codeIndex">
</el-option>
</el-select>
</el-form-item>
<div v-else>
<el-form-item class="input" label="挂号状态" prop="guahaoStatusValue">
<el-input v-model="ruleForm.guahaoStatusValue"
placeholder="挂号状态" readonly></el-input>
</el-form-item>
</div>
</el-col>
</el-row>
<el-form-item class="btn">
<el-button v-if="type!='info'" type="primary" class="btn-success" @click="onSubmit">提交</el-button>
<el-button v-if="type!='info'" class="btn-close" @click="back()">取消</el-button>
<el-button v-if="type=='info'" class="btn-close" @click="back()">返回</el-button>
<el-col :span="12" v-if="sessionTable!='yisheng' ">
<!-- 当 type 不是 'info' 时显示该表单域，用于显示医生工号（只读） -->
<el-form-item class="input" v-if="type!='info'" label="医生工号" prop="yishengUuidNumber">
<el-input v-model="yishengForm.yishengUuidNumber"
placeholder="医生工号" clearable readonly></el-input>
</el-form-item>
<!-- 当 type 是 'info' 时显示该表单域，用于显示医生工号（只读） -->
<div v-else>
<el-form-item class="input" label="医生工号" prop="yishengUuidNumber">
<el-input v-model="ruleForm.yishengUuidNumber"
placeholder="医生工号" readonly></el-input>
</el-form-item>
</el-form>
</div>
</template>
<script>
import styleJs from "../../../utils/style.js";
// 数字，邮件，手机，url，身份证校验
import { isNumber,isIntNumer,isEmail,isPhone, isMobile,isURL,checkIdCard } from "@/utils/validate";
export default {
data() {
return {
addEditForm:null,
id: '',
type: '',
sessionTable : "",//登录账户所在表名
role : "",//权限
userId:"",//当前登录人的id
yishengForm: {},
yonghuForm: {},
ro:{
yishengId: false,
yonghuId: false,
guahaoUuinNumber: false,
guahaoTime: false,
guahaoTypes: false,
guahaoStatusTypes: false,
guahaoYesnoTypes: false,
guahaoYesnoText: false,
},
ruleForm: {
yishengId: '',
yonghuId: '',
guahaoUuinNumber: '',
guahaoTime: '',
guahaoTypes: '',
guahaoStatusTypes: '',
guahaoYesnoTypes: '',
guahaoYesnoText: '',
},
guahaoTypesOptions : [],
guahaoStatusTypesOptions : [],
guahaoYesnoTypesOptions : [],
yishengOptions : [],
yonghuOptions : [],
rules: {
yishengId: [
{ required: true, message: '医生不能为空', trigger: 'blur' },
{ pattern: /^[1-9][0-9]*$/,
message: '只允许输入整数',
trigger: 'blur'
}
],
yonghuId: [
{ required: true, message: '用户不能为空', trigger: 'blur' },
{ pattern: /^[1-9][0-9]*$/,
message: '只允许输入整数',
trigger: 'blur'
}
],
guahaoUuinNumber: [
{ required: true, message: '就诊识别码不能为空', trigger: 'blur' },
{ pattern: /^[1-9][0-9]*$/,
message: '只允许输入整数',
trigger: 'blur'
}
],
guahaoTime: [
{ required: true, message: '挂号时间不能为空', trigger: 'blur' },
],
guahaoTypes: [
{ required: true, message: '时间类型不能为空', trigger: 'blur' },
{ pattern: /^[1-9][0-9]*$/,
message: '只允许输入整数',
trigger: 'blur'
}
],
guahaoStatusTypes: [
{ required: true, message: '挂号状态不能为空', trigger: 'blur' },
{ pattern: /^[1-9][0-9]*$/,
message: '只允许输入整数',
trigger: 'blur'
}
],
guahaoYesnoTypes: [
{ required: true, message: '挂号审核不能为空', trigger: 'blur' },
{ pattern: /^[1-9][0-9]*$/,
message: '只允许输入整数',
trigger: 'blur'
}
],
guahaoYesnoText: [
{ required: true, message: '审核结果不能为空', trigger: 'blur' },
],
}
};
},
props: ["parent"],
computed: {
},
created() {
//获取当前登录用户的信息
this.sessionTable = this.$storage.get("sessionTable");
this.role = this.$storage.get("role");
this.userId = this.$storage.get("userId");
if (this.role != "管理员"){
}
this.addEditForm = styleJs.addStyle();
this.addEditStyleChange()
this.addEditUploadStyleChange()
//获取下拉框信息
this.$http({
url:`dictionary/page?page=1&limit=100&sort=&order=&dicCode=guahao_types`,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
this.guahaoTypesOptions = data.data.list;
}
});
this.$http({
url:`dictionary/page?page=1&limit=100&sort=&order=&dicCode=guahao_status_types`,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
this.guahaoStatusTypesOptions = data.data.list;
}
});
this.$http({
url:`dictionary/page?page=1&limit=100&sort=&order=&dicCode=guahao_yesno_types`,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
this.guahaoYesnoTypesOptions = data.data.list;
}
});
this.$http({
url: `yisheng/page?page=1&limit=100`,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
this.yishengOptions = data.data.list;
}
});
this.$http({
url: `yonghu/page?page=1&limit=100`,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
this.yonghuOptions = data.data.list;
}
});
},
mounted() {
},
methods: {
// 下载
download(file){
window.open(`${file}`)
},
// 初始化
init(id,type) {
if (id) {
this.id = id;
this.type = type;
}
if(this.type=='info'||this.type=='else'){
this.info(id);
}
// 获取用户信息
this.$http({
url:`${this.$storage.get("sessionTable")}/session`,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
var json = data.data;
} else {
this.$message.error(data.msg);
}
});
},
yishengChange(id){
this.$http({
url: `yisheng/info/`+id,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
this.yishengForm = data.data;
}
});
},
yonghuChange(id){
this.$http({
url: `yonghu/info/`+id,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
this.yonghuForm = data.data;
}
});
},
// 多级联动参数
info(id) {
let _this =this;
_this.$http({
url: `guahao/info/${id}`,
method: 'get'
}).then(({ data }) => {
if (data && data.code === 0) {
_this.ruleForm = data.data;
_this.yishengChange(data.data.yishengId)
_this.yonghuChange(data.data.yonghuId)
} else {
_this.$message.error(data.msg);
}
});
},
// 提交
onSubmit() {
this.$refs["ruleForm"].validate(valid => {
if (valid) {
this.$http({
url:`guahao/${!this.ruleForm.id ? "save" : "update"}`,
method: "post",
data: this.ruleForm
}).then(({ data }) => {
if (data && data.code === 0) {
this.$message({
message: "操作成功",
type: "success",
duration: 1500,
onClose: () => {
this.parent.showFlag = true;
this.parent.addOrUpdateFlag = false;
this.parent.guahaoCrossAddOrUpdateFlag = false;
this.parent.search();
this.parent.contentStyleChange();
}
});
} else {
this.$message.error(data.msg);
}
});
}
});
},
// 获取uuid
getUUID () {
return new Date().getTime();
},
// 返回
back() {
this.parent.showFlag = true;
this.parent.addOrUpdateFlag = false;
this.parent.guahaoCrossAddOrUpdateFlag = false;
this.parent.contentStyleChange();
},
//图片
addEditStyleChange() {
this.$nextTick(()=>{
// input
document.querySelectorAll('.addEdit-block .input .el-input__inner').forEach(el=>{
el.style.height = this.addEditForm.inputHeight
el.style.color = this.addEditForm.inputFontColor
el.style.fontSize = this.addEditForm.inputFontSize
el.style.borderWidth = this.addEditForm.inputBorderWidth
el.style.borderStyle = this.addEditForm.inputBorderStyle
el.style.borderColor = this.addEditForm.inputBorderColor
el.style.borderRadius = this.addEditForm.inputBorderRadius
el.style.backgroundColor = this.addEditForm.inputBgColor
})
document.querySelectorAll('.addEdit-block .input .el-form-item__label').forEach(el=>{
el.style.lineHeight = this.addEditForm.inputHeight
el.style.color = this.addEditForm.inputLableColor
el.style.fontSize = this.addEditForm.inputLableFontSize
})
// select
document.querySelectorAll('.addEdit-block .select .el-input__inner').forEach(el=>{
el.style.height = this.addEditForm.selectHeight
el.style.color = this.addEditForm.selectFontColor
el.style.fontSize = this.addEditForm.selectFontSize
el.style.borderWidth = this.addEditForm.selectBorderWidth
el.style.borderStyle = this.addEditForm.selectBorderStyle
el.style.borderColor = this.addEditForm.selectBorderColor
el.style.borderRadius = this.addEditForm.selectBorderRadius
el.style.backgroundColor = this.addEditForm.selectBgColor
})
document.querySelectorAll('.addEdit-block .select .el-form-item__label').forEach(el=>{
el.style.lineHeight = this.addEditForm.selectHeight
el.style.color = this.addEditForm.selectLableColor
el.style.fontSize = this.addEditForm.selectLableFontSize
})
document.querySelectorAll('.addEdit-block .select .el-select__caret').forEach(el=>{
el.style.color = this.addEditForm.selectIconFontColor
el.style.fontSize = this.addEditForm.selectIconFontSize
})
// date
document.querySelectorAll('.addEdit-block .date .el-input__inner').forEach(el=>{
el.style.height = this.addEditForm.dateHeight
el.style.color = this.addEditForm.dateFontColor
el.style.fontSize = this.addEditForm.dateFontSize
el.style.borderWidth = this.addEditForm.dateBorderWidth
el.style.borderStyle = this.addEditForm.dateBorderStyle
el.style.borderColor = this.addEditForm.dateBorderColor
el.style.borderRadius = this.addEditForm.dateBorderRadius
el.style.backgroundColor = this.addEditForm.dateBgColor
})
document.querySelectorAll('.addEdit-block .date .el-form-item__label').forEach(el=>{
el.style.lineHeight = this.addEditForm.dateHeight
el.style.color = this.addEditForm.dateLableColor
el.style.fontSize = this.addEditForm.dateLableFontSize
})
document.querySelectorAll('.addEdit-block .date .el-input__icon').forEach(el=>{
el.style.color = this.addEditForm.dateIconFontColor
el.style.fontSize = this.addEditForm.dateIconFontSize
el.style.lineHeight = this.addEditForm.dateHeight
})
// upload
let iconLineHeight = parseInt(this.addEditForm.uploadHeight) - parseInt(this.addEditForm.uploadBorderWidth) * 2 + 'px'
document.querySelectorAll('.addEdit-block .upload .el-upload--picture-card').forEach(el=>{
el.style.width = this.addEditForm.uploadHeight
el.style.height = this.addEditForm.uploadHeight
el.style.borderWidth = this.addEditForm.uploadBorderWidth
el.style.borderStyle = this.addEditForm.uploadBorderStyle
el.style.borderColor = this.addEditForm.uploadBorderColor
el.style.borderRadius = this.addEditForm.uploadBorderRadius
el.style.backgroundColor = this.addEditForm.uploadBgColor
})
document.querySelectorAll('.addEdit-block .upload .el-form-item__label').forEach(el=>{
el.style.lineHeight = this.addEditForm.uploadHeight
el.style.color = this.addEditForm.uploadLableColor
el.style.fontSize = this.addEditForm.uploadLableFontSize
})
document.querySelectorAll('.addEdit-block .upload .el-icon-plus').forEach(el=>{
el.style.color = this.addEditForm.uploadIconFontColor
el.style.fontSize = this.addEditForm.uploadIconFontSize
el.style.lineHeight = iconLineHeight
el.style.display = 'block'
})
// 多文本输入框
document.querySelectorAll('.addEdit-block .textarea .el-textarea__inner').forEach(el=>{
el.style.height = this.addEditForm.textareaHeight
el.style.color = this.addEditForm.textareaFontColor
el.style.fontSize = this.addEditForm.textareaFontSize
el.style.borderWidth = this.addEditForm.textareaBorderWidth
el.style.borderStyle = this.addEditForm.textareaBorderStyle
el.style.borderColor = this.addEditForm.textareaBorderColor
el.style.borderRadius = this.addEditForm.textareaBorderRadius
el.style.backgroundColor = this.addEditForm.textareaBgColor
})
document.querySelectorAll('.addEdit-block .textarea .el-form-item__label').forEach(el=>{
// el.style.lineHeight = this.addEditForm.textareaHeight
el.style.color = this.addEditForm.textareaLableColor
el.style.fontSize = this.addEditForm.textareaLableFontSize
})
// 保存
document.querySelectorAll('.addEdit-block .btn .btn-success').forEach(el=>{
el.style.width = this.addEditForm.btnSaveWidth
el.style.height = this.addEditForm.btnSaveHeight
el.style.color = this.addEditForm.btnSaveFontColor
el.style.fontSize = this.addEditForm.btnSaveFontSize
el.style.borderWidth = this.addEditForm.btnSaveBorderWidth
el.style.borderStyle = this.addEditForm.btnSaveBorderStyle
el.style.borderColor = this.addEditForm.btnSaveBorderColor
el.style.borderRadius = this.addEditForm.btnSaveBorderRadius
el.style.backgroundColor = this.addEditForm.btnSaveBgColor
})
// 返回
document.querySelectorAll('.addEdit-block .btn .btn-close').forEach(el=>{
el.style.width = this.addEditForm.btnCancelWidth
el.style.height = this.addEditForm.btnCancelHeight
el.style.color = this.addEditForm.btnCancelFontColor
el.style.fontSize = this.addEditForm.btnCancelFontSize
el.style.borderWidth = this.addEditForm.btnCancelBorderWidth
el.style.borderStyle = this.addEditForm.btnCancelBorderStyle
el.style.borderColor = this.addEditForm.btnCancelBorderColor
el.style.borderRadius = this.addEditForm.btnCancelBorderRadius
el.style.backgroundColor = this.addEditForm.btnCancelBgColor
})
})
},
addEditUploadStyleChange() {
this.$nextTick(()=>{
document.querySelectorAll('.addEdit-block .upload .el-upload-list--picture-card .el-upload-list__item').forEach(el=>{
el.style.width = this.addEditForm.uploadHeight
el.style.height = this.addEditForm.uploadHeight
el.style.borderWidth = this.addEditForm.uploadBorderWidth
el.style.borderStyle = this.addEditForm.uploadBorderStyle
el.style.borderColor = this.addEditForm.uploadBorderColor
el.style.borderRadius = this.addEditForm.uploadBorderRadius
el.style.backgroundColor = this.addEditForm.uploadBgColor
})
})
},
}
};
</script>
<style lang="scss">
.editor{
height: 500px;
</div>
</el-col>
<!-- 以下类似结构的代码块，根据不同条件显示和处理不同的表单域，用于显示和编辑医生的相关信息 -->
<el-col :span="12" v-if="sessionTable!='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="医生名称" prop="yishengName">
<el-input v-model="yishengForm.yishengName"
placeholder="医生名称" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="医生名称" prop="yishengName">
<el-input v-model="ruleForm.yishengName"
placeholder="医生名称" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable!='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="科室" prop="yishengValue">
<el-input v-model="yishengForm.yishengValue"
placeholder="科室" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="科室" prop="yishengValue">
<el-input v-model="ruleForm.yishengValue"
placeholder="科室" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable!='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="职位" prop="zhiweiValue">
<el-input v-model="yishengForm.zhiweiValue"
placeholder="职位" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="职位" prop="zhiweiValue">
<el-input v-model="ruleForm.zhiweiValue"
placeholder="职位" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable!='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="职称" prop="yishengZhichneg">
<el-input v-model="yishengForm.yishengZhichneg"
placeholder="职称" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="职称" prop="yishengZhichneg">
<el-input v-model="ruleForm.yishengZhichneg"
placeholder="职称" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="24" v-if="sessionTable!='yisheng' ">
<!-- 当 type 不是 'info' 且 ro.yishengPhoto 为 false 时显示该表单域，用于上传医生头像 -->
<el-form-item class="upload" v-if="type!='info' &&!ro.yishengPhoto" label="医生头像" prop="yishengPhoto">
<!-- 循环显示已上传的头像图片 -->
<img style="margin-right:20px;" v-bind:key="index" v-for="(item,index) in (yishengForm.yishengPhoto || '').split(',')" :src="item" width="100" height="100">
</el-form-item>
<div v-else>
<!-- 当 type 是 'info' 且 ruleForm.yishengPhoto 存在时显示该表单域，用于显示医生头像 -->
<el-form-item v-if="ruleForm.yishengPhoto" label="医生头像" prop="yishengPhoto">
<img style="margin-right:20px;" v-bind:key="index" v-for="(item,index) in (ruleForm.yishengPhoto || '').split(',')" :src="item" width="100" height="100">
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable!='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="联系方式" prop="yishengPhone">
<el-input v-model="yishengForm.yishengPhone"
placeholder="联系方式" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="联系方式" prop="yishengPhone">
<el-input v-model="ruleForm.yishengPhone"
placeholder="联系方式" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable!='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="挂号须知" prop="yishengGuahao">
<el-input v-model="yishengForm.yishengGuahao"
placeholder="挂号须知" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="挂号须知" prop="yishengGuahao">
<el-input v-model="ruleForm.yishengGuahao"
placeholder="挂号须知" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable!='yisheng' ">
<el-form-item class="input" v-if="type!='info'" label="邮箱" prop="yishengEmail">
<el-input v-model="yishengForm.yishengEmail"
placeholder="邮箱" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="邮箱" prop="yishengEmail">
<el-input v-model="ruleForm.yishengEmail"
placeholder="邮箱" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable!='yonghu'">
<el-form-item class="select" v-if="type!='info'" label="用户" prop="yonghuId">
<el-select v-model="ruleForm.yonghuId" :disabled="ro.yonghuId" filterable placeholder="请选择用户" @change="yonghuChange">
<el-option
v-for="(item,index) in yonghuOptions"
v-bind:key="item.id"
:label="item.yonghuName"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
& /deep/ .ql-container {
height: 310px;
}
}
.amap-wrapper {
width: 100%;
height: 500px;
}
.search-box {
position: absolute;
}
.addEdit-block {
margin: -10px;
}
.detail-form-content {
padding: 12px;
}
.btn .el-button {
padding: 0;
}</style>
<el-col :span="12" v-if="sessionTable!='yonghu' ">
<el-form-item class="input" v-if="type!='info'" label="用户姓名" prop="yonghuName">
<el-input v-model="yonghuForm.yonghuName"
placeholder="用户姓名" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="用户姓名" prop="yonghuName">
<el-input v-model="ruleForm.yonghuName"
placeholder="用户姓名" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="24" v-if="sessionTable!='yonghu' ">
<el-form-item class="upload" v-if="type!='info' && !ro.yonghuPhoto" label="头像" prop="yonghuPhoto">
<img style="margin-right:20px;" v-bind:key="index" v-for="(item,index) in (yonghuForm.yonghuPhoto || '').split(',')" :src="item" width="100" height="100">
</el-form-item>
<div v-else>
<el-form-item v-if="ruleForm.yonghuPhoto" label="头像" prop="yonghuPhoto">
<img style="margin-right:20px;" v-bind:key="index" v-for="(item,index) in (ruleForm.yonghuPhoto || '').split(',')" :src="item" width="100" height="100">
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable!='yonghu' ">
<el-form-item class="input" v-if="type!='info'" label="用户手机号" prop="yonghuPhone">
<el-input v-model="yonghuForm.yonghuPhone"
placeholder="用户手机号" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="用户手机号" prop="yonghuPhone">
<el-input v-model="ruleForm.yonghuPhone"
placeholder="用户手机号" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable!='yonghu' ">
<el-form-item class="input" v-if="type!='info'" label="用户身份证号" prop="yonghuIdNumber">
<el-input v-model="yonghuForm.yonghuIdNumber"
placeholder="用户身份证号" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="用户身份证号" prop="yonghuIdNumber">
<el-input v-model="ruleForm.yonghuIdNumber"
placeholder="用户身份证号" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12" v-if="sessionTable!='yonghu' ">
<el-form-item class="input" v-if="type!='info'" label="邮箱" prop="yonghuEmail">
<el-input v-model="yonghuForm.yonghuEmail"
placeholder="邮箱" clearable readonly></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="邮箱" prop="yonghuEmail">
<el-input v-model="ruleForm.yonghuEmail"
placeholder="邮箱" readonly></el-input>
</el-form-item>
</div>
</el-col>
<!-- 隐藏输入框，用于存储相关 ID -->
<input id="updateId" name="id" type="hidden">
<input id="yishengId" name="yishengId" type="hidden">
<input id="yonghuId" name="yonghuId" type="hidden">
<el-col :span="12">
<el-form-item class="input" v-if="type!='info'" label="就诊识别码" prop="guahaoUuinNumber">
<el-input v-model="ruleForm.guahaoUuinNumber"
placeholder="就诊识别码" clearable :readonly="ro.guahaoUuinNumber"></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="就诊识别码" prop="guahaoUuinNumber">
<el-input v-model="ruleForm.guahaoUuinNumber"
placeholder="就诊识别码" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="24">
<el-form-item v-if="type!='info'" class="input" label="挂号时间" prop="guahaoTime">
<el-date-picker
value-format="yyyy-MM-dd"
v-model="ruleForm.guahaoTime"
type="date"
placeholder="挂号时间"
:disabled="ro.guahaoTime">
</el-date-picker>
</el-form-item>
<div v-else>
<el-form-item v-if="ruleForm.guahaoTime" label="挂号时间" prop="guahaoTime">
<span v-html="ruleForm.guahaoTime"></span>
</el-form-item>
</div>
</el-col>
<el-col :span="12">
<el-form-item class="select" v-if="type!='info'" label="时间类型" prop="guahaoTypes">
<el-select v-model="ruleForm.guahaoTypes" :disabled="ro.guahaoTypes" placeholder="请选择时间类型">
<el-option
v-for="(item,index) in guahaoTypesOptions"
v-bind:key="item.codeIndex"
:label="item.indexName"
:value="item.codeIndex">
</el-option>
</el-select>
</el-form-item>
<div v-else>
<el-form-item class="input" label="时间类型" prop="guahaoValue">
<el-input v-model="ruleForm.guahaoValue"
placeholder="时间类型" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12">
<el-form-item class="select" v-if="type!='info'" label="挂号状态" prop="guahaoStatusTypes">
<el-select v-model="ruleForm.guahaoStatusTypes" :disabled="ro.guahaoStatusTypes" placeholder="请选择挂号状态">
<el-option
v-for="(item,index) in guahaoStatusTypesOptions"
v-bind:key="item.codeIndex"
:label="item.indexName"
:value="item.codeIndex">
</el-option>
</el-select>
</el-form-item>
<div v-else>
<el-form-item class="input" label="挂号状态" prop="guahaoStatusValue">
<el-input v-model="ruleForm.guahaoStatusValue"
placeholder="挂号状态" readonly></el-input>
</el-form-item>
</div>
</el-col>
</el-row>
<el-form-item class="btn">
<!-- 当 type 不是 'info

485
src/main/resources/front/front/pages/yisheng/add.html
Unescape View File

@ -1,5 +1,6 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
@ -14,6 +15,7 @@
<!-- 通用的css -->
<link rel="stylesheet" href="../../css/common.css" />
</head>
<!-- 自定义样式部分，设置页面背景、轮播图指示器、按钮样式等 -->
<style>
html::after {
position: fixed;
@ -28,34 +30,38 @@
background-position: center;
z-index: -1;
}
#swiper {
overflow: hidden;
margin: 0 auto;
}
#swiper .layui-carousel-ind li {
#swiper.layui-carousel-ind li {
width: 20px;
height: 10px;
border-width: 0;
border-style: solid;
border-color: rgba(0,0,0,.3);
border-color: rgba(0, 0, 0,.3);
border-radius: 6px;
background-color: #f7f7f7;
box-shadow: 0 0 6px rgba(255,0,0,.8);
box-shadow: 0 0 6px rgba(255, 0, 0,.8);
}
#swiper .layui-carousel-ind li.layui-this {
#swiper.layui-carousel-ind li.layui-this {
width: 30px;
height: 10px;
border-width: 0;
border-style: solid;
border-color: rgba(0,0,0,.3);
border-color: rgba(0, 0, 0,.3);
border-radius: 6px;
}
button, button:focus {
button,
button:focus {
outline: none;
}
.data-add-container .add .layui-select-title .layui-unselect {
.data-add-container.add.layui-select-title.layui-unselect {
padding: 0 12px;
height: 40px;
font-size: 15px;
@ -64,408 +70,123 @@
border-style: solid;
text-align: center;
}
.data-add-container .add .layui-form-item {
.data-add-container.add.layui-form-item {
display: flex;
align-items: center;
justify-content: center;
}
.data-add-container .layui-form-pane .layui-form-item[pane] .layui-form-label {
.data-add-container.layui-form-pane.layui-form-item[pane].layui-form-label {
margin: 0;
position: inherit;
background: transparent;
border: 0;
}
.data-add-container .add .layui-input-block {
.data-add-container.add.layui-input-block {
margin: 0;
flex: 1;
}
.data-add-container .layui-form-pane .layui-form-item[pane] .layui-input-inline {
.data-add-container.layui-form-pane.layui-form-item[pane].layui-input-inline {
margin: 0;
flex: 1;
display: flex;
}
</style>
<body style="background: #EEEEEE; ">
<div id="app">
<div class="layui-carousel" id="swiper" :style='{"boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 auto","borderColor":"rgba(0,0,0,.3)","borderRadius":"0px","borderWidth":"0","width":"100%","borderStyle":"solid"}'>
<div carousel-item id="swiper-item">
<div v-for="(item,index) in swiperList" :key="index">
<img style="width: 100%;height: 100%;object-fit:cover;" :src="item.img" />
</div>
<body style="background: #EEEEEE; ">
<div id="app">
<!-- 轮播图部分，使用Layui的轮播图组件 -->
<div class="layui-carousel" id="swiper" :style='{"boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 auto","borderColor":"rgba(0,0,0,.3)","borderRadius":"0px","borderWidth":"0","width":"100%","borderStyle":"solid"}'>
<div carousel-item id="swiper-item">
<!-- 循环渲染轮播图图片 -->
<div v-for="(item, index) in swiperList" :key="index">
<img style="width: 100%; height: 100%; object-fit: cover;" :src="item.img" />
</div>
</div>
<!-- 轮播图 -->
<div class="data-add-container sub_borderColor" :style='{"padding":"20px","margin":"30px auto","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"10px","borderWidth":"1px","borderStyle":"solid"}'>
<form class="layui-form layui-form-pane add" lay-filter="myForm">
0
<!-- 当前表的 -->
<!-- 唯一uuid -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生工号：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengUuidNumber" lay-verify="required" type="text" :readonly="ro.yishengUuidNumber" name="yishengUuidNumber" id="yishengUuidNumber" autocomplete="off">
</div>
</div>
<!-- 轮播图 -->
<!-- 医生信息添加表单容器 -->
<div class="data-add-container sub_borderColor" :style='{"padding":"20px","margin":"30px auto","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"10px","borderWidth":"1px","borderStyle":"solid"}'>
<form class="layui-form layui-form-pane add" lay-filter="myForm">
<!-- 医生工号输入框 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生工号：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengUuidNumber" lay-verify="required" type="text" :readonly="ro.yishengUuidNumber" name="yishengUuidNumber" id="yishengUuidNumber" autocomplete="off">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
账户：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
</div>
<!-- 账户输入框 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
账户：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.username" type="text" :readonly="ro.username" name="username" id="username" autocomplete="off">
</div>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生名称：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
</div>
<!-- 医生名称输入框 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生名称：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengName" type="text" :readonly="ro.yishengName" name="yishengName" id="yishengName" autocomplete="off">
</div>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职位：
</label>
<div class="layui-input-block">
<select name="zhiweiTypes" id="zhiweiTypes" lay-filter="zhiweiTypes">
<option value="">请选择</option>
<option v-for="(item,index) in zhiweiTypesList" v-bind:key="index" :value="item.codeIndex" :key="item.codeIndex">{{ item.indexName }}</option>
</select>
</div>
</div>
<!-- 职位选择框 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职位：
</label>
<div class="layui-input-block">
<select name="zhiweiTypes" id="zhiweiTypes" lay-filter="zhiweiTypes">
<option value="">请选择</option>
<!-- 循环渲染职位选项 -->
<option v-for="(item, index) in zhiweiTypesList" v-bind:key="index" :value="item.codeIndex" :key="item.codeIndex">{{ item.indexName }}</option>
</select>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职称：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
</div>
<!-- 职称输入框 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职称：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengZhichneg" type="text" :readonly="ro.yishengZhichneg" name="yishengZhichneg" id="yishengZhichneg" autocomplete="off">
</div>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生头像：
</label>
<div class="layui-input-block">
<div v-if="detail.yishengPhoto" style="display:inline-block;margin-right:10px;">
<img id="yishengPhotoImg" style="width: 100px;height: 100px;border-radius: 50%;border: 2px solid #EEEEEE;" :src="detail.yishengPhoto">
<input type="hidden" :value="detail.yishengPhoto" id="yishengPhoto" name="yishengPhoto" />
</div>
<button v-if="!ro.yishengPhoto" :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"0 10px 0 0","borderColor":"#ccc","color":"#fff","borderRadius":"8px","borderWidth":"0","width":"auto","fontSize":"14px","borderStyle":"solid","height":"44px"}' type="button" class="layui-btn btn-theme main_backgroundColor" id="yishengPhotoUpload">
<i v-if="true" :style='{"color":"#fff","show":true,"fontSize":"14px"}' class="layui-icon">&#xe67c;</i>上传医生头像
</button>
</div>
</div>
<!-- 手机号 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
联系方式：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengPhone" lay-verify="phone|required" type="text" :readonly="ro.yishengPhone" name="yishengPhone" id="yishengPhone" autocomplete="off">
</div>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
挂号须知：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengGuahao" type="text" :readonly="ro.yishengGuahao" name="yishengGuahao" id="yishengGuahao" autocomplete="off">
</div>
</div>
<!-- 邮箱 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
邮箱：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengEmail" lay-verify="email|required" type="text" :readonly="ro.yishengEmail" name="yishengEmail" id="yishengEmail" autocomplete="off">
</div>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<div class="layui-input-block" style="text-align: right;">
<button :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"0 10px","borderColor":"#ccc","backgroundColor":"rgba(75, 92, 196, 1)","color":"#fff","borderRadius":"8px","borderWidth":"0","width":"25%","fontSize":"14px","borderStyle":"solid","height":"44px"}' class="layui-btn btn-submit" lay-submit lay-filter="thisSubmit">提交</button>
</div>
<!-- 医生头像上传部分 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生头像：
</label>
<div class="layui-input-block">
<!-- 如果有头像则显示头像图片和隐藏的头像路径输入框 -->
<div v-if="detail.yishengPhoto" style="display: inline-block; margin-right: 10px;">
<img id="yishengPhotoImg" style="width: 100px; height: 100px; border-radius: 50%; border: 2px solid #EEEEEE;" :src="detail.yishengPhoto">
<input type="hidden" :value="detail.yishengPhoto" id="yishengPhoto" name="yishengPhoto" />
</div>
<!-- 如果头像可编辑则显示上传按钮 -->
<button v-if="!ro.yishengPhoto" :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"0 10px 0 0","borderColor":"#ccc","color":"#fff","borderRadius":"8px","borderWidth":"0","width":"auto","fontSize":"14px","borderStyle":"solid","height":"44px"}' type="button" class="layui-btn btn-theme main_backgroundColor" id="yishengPhotoUpload">
<i v-if="true" :style='{"color":"#fff","show":true,"fontSize":"14px"}' class="layui-icon">&#xe67c;</i>上传医生头像
</button>
</div>
</form>
</div>
</div>
<script src="../../layui/layui.js"></script>
<script src="../../js/vue.js"></script>
<!-- 引入element组件库 -->
<script src="../../xznstatic/js/element.min.js"></script>
<!-- 引入element样式 -->
<link rel="stylesheet" href="../../xznstatic/css/element.min.css">
<!-- 组件配置信息 -->
<script src="../../js/config.js"></script>
<!-- 扩展插件配置信息 -->
<script src="../../modules/config.js"></script>
<!-- 工具方法 -->
<script src="../../js/utils.js"></script>
<!-- 校验格式工具类 -->
<script src="../../js/validate.js"></script>
<!-- 地图 -->
<script type="text/javascript" src="../../js/jquery.js"></script>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=ca04cee7ac952691aa67a131e6f0cee0"></script>
<script type="text/javascript" src="../../js/bootstrap.min.js"></script>
<script type="text/javascript" src="../../js/bootstrap.AMapPositionPicker.js"></script>
<script>
var jquery = $;
var vue = new Vue({
el: '#app',
data: {
// 轮播图
swiperList: [{
img: '../../img/banner.jpg'
}],
dataList: [],
ro:{
yishengUuidNumber: true,
username: false,
password: false,
yishengName: false,
yishengTypes: false,
zhiweiTypes: false,
yishengZhichneg: false,
yishengPhoto: false,
yishengPhone: false,
yishengGuahao: false,
yishengEmail: false,
yishengNewMoney: false,
yishengContent: false,
createTime: false,
},
detail: {
yishengUuidNumber: new Date().getTime(),//数字
username: '',
password: '',
yishengName: '',
yishengTypes: '',//数字
yishengValue: '',//数字对应的值
zhiweiTypes: '',//数字
zhiweiValue: '',//数字对应的值
yishengZhichneg: '',
yishengPhoto: '',
yishengPhone: '',
yishengGuahao: '',
yishengEmail: '',
yishengNewMoney: '',
yishengContent: '',
createTime: '',
},
// 级联表的
// 下拉框
yishengTypesList: [],
zhiweiTypesList: [],
centerMenu: centerMenu
},
updated: function() {
layui.form.render('select', 'myForm');
},
computed: {
},
methods: {
jump(url) {
jump(url)
}
}
})
layui.use(['layer', 'element', 'carousel', 'http', 'jquery', 'form', 'upload', 'laydate','tinymce'], function() {
var layer = layui.layer;
var element = layui.element;
var carousel = layui.carousel;
var http = layui.http;
var jquery = layui.jquery;
var form = layui.form;
var upload = layui.upload;
var laydate = layui.laydate;
var tinymce = layui.tinymce
// 获取轮播图 数据
http.request('config/list', 'get', {
page: 1,
limit: 5
}, function (res) {
if (res.data.list.length > 0) {
let swiperList = [];
res.data.list.forEach(element => {
if(element.value != null){
swiperList.push({
img: element.value
});
}
});
vue.swiperList = swiperList;
vue.$nextTick(() => {
carousel.render({
elem: '#swiper',
width: '100%',
height: '450px',
arrow: 'hover',
anim: 'default',
autoplay: 'true',
interval: '3000',
indicator: 'inside'
});
});
}
});
// 下拉框
// 科室的查询和初始化
yishengTypesSelect();
// 职位的查询和初始化
zhiweiTypesSelect();
// 上传文件
// 医生头像的文件上传
upload.render({
//绑定元素
elem: '#yishengPhotoUpload',
//上传接口
url: http.baseurl + 'file/upload',
// 请求头
headers: {
Token: localStorage.getItem('Token')
},
// 允许上传时校验的文件类型
accept: 'images',
before: function () {
//loading层
var index = layer.load(1, {
shade: [0.1, '#fff'] //0.1透明度的白色背景
});
},
// 上传成功
done: function (res) {
console.log(res);
layer.closeAll();
if (res.code == 0) {
layer.msg("上传成功", {
time: 2000,
icon: 6
})
var url = http.baseurl + 'upload/' + res.file;
jquery('#yishengPhoto').val(url);
vue.detail.yishengPhoto = url;
jquery('#yishengPhotoImg').attr('src', url);
} else {
layer.msg(res.msg, {
time: 2000,
icon: 5
})
}
},
//请求异常回调
error: function () {
layer.closeAll();
layer.msg("请求接口异常", {
time: 2000,
icon: 5
})
}
});
// 日期效验规则及格式
dateTimePick();
// 表单效验规则
form.verify({
// 正整数效验规则
integer: [
/^[1-9][0-9]*$/
,'必须是正整数'
]
// 小数效验规则
,double: [
/^[1-9][0-9]{0,5}(\.[0-9]{1,2})?$/
,'最大整数位为6为,小数最大两位'
]
});
// session独取
let table = localStorage.getItem("userTable");
http.request(table+"/session", 'get', {}, function (data) {
// 表单赋值
//form.val("myForm", data.data);
// data = data.data;
for (var key in data) {
vue.detail[table+"Id"] = data.id
}
});
// 提交
form.on('submit(thisSubmit)', function (data) {
data = data.field;
data["Id"]= localStorage.getItem("userid");
// 提交数据
http.requestJson('yisheng' + '/add', 'post', data, function (res) {
layer.msg('提交成功', {
time: 2000,
icon: 6
}, function () {
back();
});
});
return false
});
});
// 日期框初始化
function dateTimePick(){
var myDate = new Date(); //获取当前时间
/*
,change: function(value, date, endDate){
value 得到日期生成的值，如：2017-08-18
date 得到日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
endDate 得结束的日期时间对象，开启范围选择（range: true）才会返回。对象成员同上。
*/
}
// 科室的查询
function yishengTypesSelect() {
//填充下拉框选项
layui.http.request("dictionary/page?page=1&limit=100&sort=&order=&dicCode=yisheng_types", "GET", {}, (res) => {
if(res.code == 0){
vue.yishengTypesList = res.data.list;
}
});
}
// 职位的查询
function zhiweiTypesSelect() {
//填充下拉框选项
layui.http.request("dictionary/page?page=1&limit=100&sort=&order=&dicCode=zhiwei_types", "GET", {}, (res) => {
if(res.code == 0){
vue.zhiweiTypesList = res.data.list;
}
});
}
</script>
</body>
</html>
</div>
<!-- 联系方式输入框 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
联系方式：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengPhone" lay-verify="phone|required" type="text" :readonly="ro.yishengPhone" name="yishengPhone"

775
src/main/resources/front/front/pages/yisheng/center.html
Unescape View File

@ -1,22 +1,25 @@
<!-- 个人中心 -->
<!DOCTYPE html>
<html>
<head>
<!-- 设置字符编码为UTF-8 -->
<meta charset="utf-8">
<!-- 设置页面在不同设备上的显示效果 -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- 设置页面标题为个人中心 -->
<title>个人中心</title>
<!-- 引入Layui的CSS样式文件 -->
<link rel="stylesheet" href="../../layui/css/layui.css">
<!-- 引入element样式 -->
<!-- 引入Element UI的CSS样式文件 -->
<link rel="stylesheet" href="../../xznstatic/css/element.min.css">
<!-- 样式 -->
<!-- 引入自定义样式文件 -->
<link rel="stylesheet" href="../../css/style.css" />
<!-- 主题（主要颜色设置） -->
<!-- 引入主题样式文件 -->
<link rel="stylesheet" href="../../css/theme.css" />
<!-- 通用的css -->
<!-- 引入通用样式文件 -->
<link rel="stylesheet" href="../../css/common.css" />
</head>
<style>
/* 设置页面背景样式 */
html::after {
position: fixed;
top: 0;
@ -30,9 +33,11 @@
background-position: center;
z-index: -1;
}
/* 设置轮播图容器样式 */
#swiper {
overflow: hidden;
}
/* 设置轮播图指示器样式 */
#swiper .layui-carousel-ind li {
width: 20px;
height: 10px;
@ -43,6 +48,7 @@
background-color: #f7f7f7;
box-shadow: 0 0 6px rgba(255,0,0,.8);
}
/* 设置轮播图当前指示器样式 */
#swiper .layui-carousel-ind li.layui-this {
width: 30px;
height: 10px;
@ -51,7 +57,7 @@
border-color: rgba(0,0,0,.3);
border-radius: 6px;
}
/* 设置标题容器样式 */
.index-title {
text-align: center;
box-sizing: border-box;
@ -61,16 +67,20 @@
align-items: center;
flex-direction: column;
}
/* 设置标题文字样式 */
.index-title span {
padding: 0 10px;
line-height: 1.4;
}
/* 设置个人中心菜单容器样式 */
.center-container .layui-nav-tree {
width: 100%;
}
/* 设置个人中心菜单样式 */
.center-container .layui-nav {
position: inherit;
}
/* 设置个人中心菜单项样式 */
.center-container .layui-nav-tree .layui-nav-item {
height: 44px;
line-height: 44px;
@ -82,10 +92,12 @@
background-color: #fff;
text-align: center;
}
/* 设置个人中心菜单选中条样式 */
.center-container .layui-nav-tree .layui-nav-bar {
height: 44px !important;
opacity: 0 !important;
}
/* 设置个人中心菜单当前选中项样式 */
.center-container .layui-nav-tree .layui-nav-item.layui-this {
font-size: 16px;
color: rgba(17, 17, 17, 1);
@ -93,6 +105,7 @@
border-style: solid;
border-radius: 0;
}
/* 设置个人中心菜单项悬停样式 */
.center-container .layui-nav-tree .layui-nav-item:hover {
font-size: 14px;
color: #fff;
@ -100,6 +113,7 @@
border-style: solid;
border-radius: 0;
}
/* 设置个人中心菜单项链接样式 */
.center-container .layui-nav-tree .layui-nav-item a {
line-height: inherit;
height: auto;
@ -107,18 +121,21 @@
color: inherit;
text-decoration: none;
}
/* 设置右侧内容容器样式 */
.right-container {
position: relative;
}
/* 设置右侧表单元素样式 */
.right-container .layui-form-item {
display: flex;
align-items: center;
}
/* 设置右侧表单输入框容器样式 */
.right-container .layui-input-block {
margin: 0;
flex: 1;
}
/* 设置右侧输入框样式 */
.right-container .input .layui-input {
padding: 0 12px;
height: 40px;
@ -129,6 +146,7 @@
background-color: #fff;
text-align: left;
}
/* 设置右侧下拉框样式 */
.right-container .select .layui-input {
padding: 0 12px;
height: 40px;
@ -139,6 +157,7 @@
background-color: #fff;
text-align: left;
}
/* 设置右侧日期输入框样式 */
.right-container .date .layui-input {
padding: 0 12px;
height: 40px;
@ -151,443 +170,361 @@
box-shadow: 0 0 0px rgba(255,0,0,.8);
text-align: left;
}
.header {animation-name: fadeInUp; padding-bottom: 26px;padding-top: 70px;position:relative;border-bottom:1px solid rgba(0,0,0,0.1);margin-bottom:40px;}
#plheader{ top: 48px;padding-bottom: 40px;width: 220px;position: relative;height: 70px;border-radius: 3px 3px 0px 0px;padding-top: 40px !important;}
.header p.title {color: #fff;font-size: 25px;margin-bottom: 8px;text-align: left;white-space: nowrap;overflow: hidden;margin-left: 31px;font-weight: bold; padding-bottom: 8px;margin-top: 0px;width: 158px;border-bottom: 1px solid rgba(255, 255, 255, 0.16);letter-spacing:1px;}
#category {padding-top: 136px;margin-left: 0px;padding-bottom: 30px;width: 205px;float: left;padding-left: 15px;text-align: left;margin-top: -120px;background-color: var(--publicMainColor);border-radius: 0px 0px 3px 3px;}
.header p.subtitle {font-family:HELVETICANEUELTPRO-THEX, "微软雅黑";letter-spacing: 1px;font-size: 15px;display: inline-block;padding-top: 0px;color: #ffffff; margin-top: 0px; margin-right:31px;float: right;overflow: hidden;width: 156px;text-align: left;}
#category a.active::before {display: none;}
#category a.active::after {display:none;}
#category a.active, #category a:hover {background: var(--publicSubColor);color: #FFFFFF;border-color: #838383;transition: 0.3s; transform-origin: bottom;}
#category li {height:auto;position:relative;float:none; display:block;margin-top:1px;margin-bottom:1px;line-height:43px;border-bottom: 1px solid rgba(255, 255, 255, 0.05);padding-left: 15px;margin-right:16px;transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;}
#category li:last-child { border-bottom:none;}
#category a { border:0px; background:none; color:#CFDCF9; font-size:14px; position:relative; padding:0;line-height: 42px;height: 42px;}
#category a::before { content:''; position:absolute; content: '';position: absolute;width: 190px;background-color: #AEAEAF;height: 42px;background: transparent;left: -16px;position: absolute;transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; }
#category a.active::before {display: none;}
#category li:hover {padding-left:30px;background-color: var(--publicSubColor);transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;}
#category .bbbb, #category li .aaaa {padding-left:30px;background-color: var(--publicSubColor);transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;background: var(--publicSubColor);color: #FFFFFF; transition: 0.3s; transform-origin: bottom;}
#category li:hover ul li{width: 136px;}
#category li:hover ul li a{color: rgba(255, 255, 255, 0.45);width: 136px;overflow: hidden; background-color: rgb(34, 73, 160); padding-left:0px;}
#category li ul li:hover a{ padding-left:0px; margin-left: 0px;}
#category li:hover a{color:#fff}
/* 设置头部动画和样式 */
.header {animation-name: fadeInUp; padding-bottom: 26px;padding-top: 70px;position:relative;border-bottom:1px solid rgba(0,0,0,0.1);margin-bottom:40px;}
/* 设置特定头部样式 */
#plheader{ top: 48px;padding-bottom: 40px;width: 220px;position: relative;height: 70px;border-radius: 3px 3px 0px 0px;padding-top: 40px !important;}
/* 设置头部标题样式 */
.header p.title {color: #fff;font-size: 25px;margin-bottom: 8px;text-align: left;white-space: nowrap;overflow: hidden;margin-left: 31px;font-weight: bold; padding-bottom: 8px;margin-top: 0px;width: 158px;border-bottom: 1px solid rgba(255, 255, 255, 0.16);letter-spacing:1px;}
/* 设置头部副标题样式 */
.header p.subtitle {font-family:HELVETICANEUELTPRO-THEX, "微软雅黑";letter-spacing: 1px;font-size: 15px;display: inline-block;padding-top: 0px;color: #ffffff; margin-top: 0px; margin-right:31px;float: right;overflow: hidden;width: 156px;text-align: left;}
/* 设置分类菜单激活项样式 */
#category a.active::before {display: none;}
/* 设置分类菜单激活项样式 */
#category a.active::after {display:none;}
/* 设置分类菜单激活项和悬停样式 */
#category a.active, #category a:hover {background: var(--publicSubColor);color: #FFFFFF;border-color: #838383;transition: 0.3s; transform-origin: bottom;}
/* 设置分类菜单项样式 */
#category li {height:auto;position:relative;float:none; display:block;margin-top:1px;margin-bottom:1px;line-height:43px;border-bottom: 1px solid rgba(255, 255, 255, 0.05);padding-left: 15px;margin-right:16px;transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;}
/* 设置分类菜单最后一项样式 */
#category li:last-child { border-bottom:none;}
/* 设置分类菜单链接样式 */
#category a { border:0px; background:none; color:#CFDCF9; font-size:14px; position:relative; padding:0;line-height: 42px;height: 42px;}
/* 设置分类菜单链接前伪元素样式 */
#category a::before { content:''; position:absolute; content: '';position: absolute;width: 190px;background-color: #AEAEAF;height: 42px;background: transparent;left: -16px;position: absolute;transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; }
/* 设置分类菜单激活项前伪元素样式 */
#category a.active::before {display: none;}
/* 设置分类菜单项悬停样式 */
#category li:hover {padding-left:30px;background-color: var(--publicSubColor);transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;}
/* 设置分类菜单特定项样式 */
#category .bbbb, #category li .aaaa {padding-left:30px;background-color: var(--publicSubColor);transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;background: var(--publicSubColor);color: #FFFFFF; transition: 0.3s; transform-origin: bottom;}
/* 设置分类菜单项悬停时子项宽度 */
#category li:hover ul li{width: 136px;}
/* 设置分类菜单项悬停时子项链接样式 */
#category li:hover ul li a{color: rgba(255, 255, 255, 0.45);width: 136px;overflow: hidden; background-color: rgb(34, 73, 160); padding-left:0px;}
/* 设置分类菜单项悬停时子项链接悬停样式 */
#category li ul li:hover a{ padding-left:0px; margin-left: 0px;}
/* 设置分类菜单项悬停时链接样式 */
#category li:hover a{color:#fff}
</style>
<body>
<div id="app">
<!-- 轮播图 -->
<div class="layui-carousel" id="swiper" :style='{"boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 auto","borderColor":"rgba(0,0,0,.3)","borderRadius":"0px","borderWidth":"0","width":"100%","borderStyle":"solid"}'>
<div carousel-item>
<div v-for="(item,index) in swiperList" :key="index">
<img style="width: 100%;height: 100%;object-fit:cover;" :src="item.img" />
</div>
<!-- Vue实例挂载点 -->
<div id="app">
<!-- 轮播图 -->
<div class="layui-carousel" id="swiper" :style='{"boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 auto","borderColor":"rgba(0,0,0,.3)","borderRadius":"0px","borderWidth":"0","width":"100%","borderStyle":"solid"}'>
<div carousel-item>
<!-- 循环渲染轮播图图片 -->
<div v-for="(item,index) in swiperList" :key="index">
<img style="width: 100%;height: 100%;object-fit:cover;" :src="item.img" />
</div>
</div>
<!-- 轮播图 -->
<!-- 标题 -->
<!-- <h2 style="margin-top: 20px;" class="index-title">USER / CENTER</h2>
<div class="line-container">
<p class="line" style="background: #EEEEEE;"> 个人中心 </p>
</div> -->
</div>
<!-- 轮播图 -->
<!-- 标题 -->
<!-- 标题 -->
<!-- <h2 style="margin-top: 20px;" class="index-title">USER / CENTER</h2>
<div class="line-container">
<p class="line" style="background: #EEEEEE;"> 个人中心 </p>
</div> -->
<!-- 标题 -->
<div class="center-container">
<!-- 个人中心菜单 config.js-->
<div style=" width:auto; margin:-70px 10px 0px auto">
<div class="header" id="plheader">
<p class="title">个人中心</p>
<p class="subtitle">USER / CENTER</p>
</div>
<ul id="category">
<li v-for="(item,index) in centerMenu" v-bind:key="index" :class="index==0?'bbbb':''">
<a :href="'javascript:jump(\''+item.url+'\')'" style="color:#FFFFFF;" :class="index==0?'aaaa':''">{{item.name}}</a>
</li>
</ul>
</div> <!-- 个人中心菜单 -->
<!-- 个人中心 -->
<div class="right-container sub_borderColor" :style='{"padding":"20px","boxShadow":"0px rgba(255,0,0,.8)","margin":"0","backgroundColor":"#fff","borderRadius":"0","borderWidth":"1px","borderStyle":"solid"}'>
<form class="layui-form">
<!-- 主键 -->
<input type="hidden" v-model="detail.id" name="id" id="id" />
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生工号
</label>
<div class="layui-input-block input">
<input type="text" v-model="detail.yishengUuidNumber" name="yishengUuidNumber" id="yishengUuidNumber" lay-verify="required" placeholder="医生工号" autocomplete="off" class="layui-input">
</div>
<!-- 个人中心容器 -->
<div class="center-container">
<!-- 个人中心菜单 config.js-->
<div style=" width:auto; margin:-70px 10px 0px auto">
<!-- 头部标题部分 -->
<div class="header" id="plheader">
<!-- 主标题 -->
<p class="title">个人中心</p>
<!-- 副标题 -->
<p class="subtitle">USER / CENTER</p>
</div>
<!-- 分类菜单 -->
<ul id="category">
<!-- 循环渲染菜单列表 -->
<li v-for="(item,index) in centerMenu" v-bind:key="index" :class="index==0?'bbbb':''">
<!-- 菜单项链接 -->
<a :href="'javascript:jump(\''+item.url+'\')'" style="color:#FFFFFF;" :class="index==0?'aaaa':''">{{item.name}}</a>
</li>
</ul>
</div>
<!-- 个人中心菜单 -->
<!-- 个人中心 -->
<div class="right-container sub_borderColor" :style='{"padding":"20px","boxShadow":"0px rgba(255,0,0,.8)","margin":"0","backgroundColor":"#fff","borderRadius":"0","borderWidth":"1px","borderStyle":"solid"}'>
<!-- 表单部分 -->
<form class="layui-form">
<!-- 隐藏的主键输入框 -->
<input type="hidden" v-model="detail.id" name="id" id="id" />
<!-- 医生工号输入项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 标签 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生工号
</label>
<!-- 输入框容器 -->
<div class="layui-input-block input">
<!-- 医生工号输入框 -->
<input type="text" v-model="detail.yishengUuidNumber" name="yishengUuidNumber" id="yishengUuidNumber" lay-verify="required" placeholder="医生工号" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
账户
</label>
<div class="layui-input-block input">
<input type="text" v-model="detail.username" name="username" id="username" lay-verify="required" placeholder="账户" autocomplete="off" class="layui-input">
</div>
</div>
<!-- 账户输入项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 标签 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
账户
</label>
<!-- 输入框容器 -->
<div class="layui-input-block input">
<!-- 账户输入框 -->
<input type="text" v-model="detail.username" name="username" id="username" lay-verify="required" placeholder="账户" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生名称
</label>
<div class="layui-input-block input">
<input type="text" v-model="detail.yishengName" name="yishengName" id="yishengName" lay-verify="required" placeholder="医生名称" autocomplete="off" class="layui-input">
</div>
</div>
<!-- 医生名称输入项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 标签 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生名称
</label>
<!-- 输入框容器 -->
<div class="layui-input-block input">
<!-- 医生名称输入框 -->
<input type="text" v-model="detail.yishengName" name="yishengName" id="yishengName" lay-verify="required" placeholder="医生名称" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
科室
</label>
<div class="layui-input-block select">
<el-select v-model="detail.yishengTypes" filterable placeholder="请选择科室 Search111" style="border-color: var(--publicMainColor, #808080);" name="yishengTypes" id="yishengTypes">
<el-option
v-for="(item,index) in yishengTypesList"
v-bind:key="item.codeIndex"
:label="item.indexName"
:value="item.codeIndex">
</el-option>
</el-select>
</div>
</div>
<!-- 科室选择项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 标签 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
科室
</label>
<!-- 选择框容器 -->
<div class="layui-input-block select">
<!-- Element UI的选择框 -->
<el-select v-model="detail.yishengTypes" filterable placeholder="请选择科室 Search111" style="border-color: var(--publicMainColor, #808080);" name="yishengTypes" id="yishengTypes">
<!-- 循环渲染科室选项 -->
<el-option
v-for="(item,index) in yishengTypesList"
v-bind:key="item.codeIndex"
:label="item.indexName"
:value="item.codeIndex">
</el-option>
</el-select>
</div>
</div>
<!-- 职位选择项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 标签 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职位
</label>
<!-- 选择框容器 -->
<div class="layui-input-block select">
<!-- Element UI的选择框 -->
<el-select v-model="detail.zhiweiTypes" filterable placeholder="请选择职位 Search111" style="border-color: var(--publicMainColor, #808080);" name="zhiweiTypes" id="zhiweiTypes">
<!-- 循环渲染职位选项 -->
<el-option
v-for="(item,index) in zhiweiTypesList"
v-bind:key="item.codeIndex"
:label="item.indexName"
:value="item.codeIndex">
</el-option>
</el-select>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职位
</label>
<div class="layui-input-block select">
<el-select v-model="detail.zhiweiTypes" filterable placeholder="请选择职位 Search111" style="border-color: var(--publicMainColor, #808080);" name="zhiweiTypes" id="zhiweiTypes">
<el-option
v-for="(item,index) in zhiweiTypesList"
v-bind:key="item.codeIndex"
:label="item.indexName"
:value="item.codeIndex">
</el-option>
</el-select>
</div>
</div>
<!-- 职称输入项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 标签 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职称
</label>
<!-- 输入框容器 -->
<div class="layui-input-block input">
<!-- 职称输入框 -->
<input type="text" v-model="detail.yishengZhichneg" name="yishengZhichneg" id="yishengZhichneg" lay-verify="required" placeholder="职称" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职称
</label>
<div class="layui-input-block input">
<input type="text" v-model="detail.yishengZhichneg" name="yishengZhichneg" id="yishengZhichneg" lay-verify="required" placeholder="职称" autocomplete="off" class="layui-input">
</div>
</div>
<!-- 医生头像显示项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 隐藏标签 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' style="opacity: 0;" class="layui-form-label">
医生头像
</label>
<!-- 头像显示容器 -->
<div class="layui-input-block">
<!-- 医生头像图片 -->
<img id="yishengPhotoImg" style="width: 100px;height: 100px;border-radius: 50%;border: 2px solid #EEEEEE;" :style='{"boxShadow":"0 0 3px rgba(160, 67, 26, 1)","borderColor":"rgba(135, 206, 250, 1)","backgroundColor":"#fff","borderRadius":"10px","borderWidth":"1px","width":"80px","borderStyle":"solid","height":"80px"}' :src="detail.yishengPhoto">
<!-- 隐藏的头像路径输入框 -->
<input type="hidden" v-model="detail.yishengPhoto" id="yishengPhoto" name="yishengPhoto" />
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' style="opacity: 0;" class="layui-form-label">
医生头像
</label>
<div class="layui-input-block">
<img id="yishengPhotoImg" style="width: 100px;height: 100px;border-radius: 50%;border: 2px solid #EEEEEE;" :style='{"boxShadow":"0 0 3px rgba(160, 67, 26, 1)","borderColor":"rgba(135, 206, 250, 1)","backgroundColor":"#fff","borderRadius":"10px","borderWidth":"1px","width":"80px","borderStyle":"solid","height":"80px"}' :src="detail.yishengPhoto">
<input type="hidden" v-model="detail.yishengPhoto" id="yishengPhoto" name="yishengPhoto" />
</div>
</div>
<!-- 医生头像上传按钮项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 隐藏标签 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' style="opacity: 0;" class="layui-form-label">
医生头像
</label>
<!-- 上传按钮容器 -->
<div class="layui-input-block">
<!-- 上传按钮 -->
<button class="main_backgroundColor" :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"0 10px 0 0","borderColor":"#ccc","color":"#fff","borderRadius":"8px","borderWidth":"0","width":"auto","fontSize":"14px","borderStyle":"solid","height":"44px"}' type="button" class="layui-btn btn-theme"
id="yishengPhotoUpload">
<!-- 上传图标 -->
<i v-if="true" :style='{"color":"#fff","show":true,"fontSize":"14px"}' class="layui-icon">&#xe67c;</i>上传医生头像
</button>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' style="opacity: 0;" class="layui-form-label">
医生头像
</label>
<div class="layui-input-block">
<button class="main_backgroundColor" :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"0 10px 0 0","borderColor":"#ccc","color":"#fff","borderRadius":"8px","borderWidth":"0","width":"auto","fontSize":"14px","borderStyle":"solid","height":"44px"}' type="button" class="layui-btn btn-theme"
id="yishengPhotoUpload">
<i v-if="true" :style='{"color":"#fff","show":true,"fontSize":"14px"}' class="layui-icon">&#xe67c;</i>上传医生头像
</button>
</div>
</div>
<!-- 联系方式输入项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 标签 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
联系方式
</label>
<!-- 输入框容器 -->
<div class="layui-input-block input">
<!-- 联系方式输入框 -->
<input type="text" v-model="detail.yishengPhone" name="yishengPhone" id="yishengPhone" lay-verify="required|phone" placeholder="联系方式" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
联系方式
</label>
<div class="layui-input-block input">
<input type="text" v-model="detail.yishengPhone" name="yishengPhone" id="yishengPhone" lay-verify="required|phone" placeholder="联系方式" autocomplete="off" class="layui-input">
</div>
</div>
<!-- 挂号须知输入项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 标签 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
挂号须知
</label>
<!-- 输入框容器 -->
<div class="layui-input-block input">
<!-- 挂号须知输入框 -->
<input type="text" v-model="detail.yishengGuahao" name="yishengGuahao" id="yishengGuahao" lay-verify="required" placeholder="挂号须知" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
挂号须知
</label>
<div class="layui-input-block input">
<input type="text" v-model="detail.yishengGuahao" name="yishengGuahao" id="yishengGuahao" lay-verify="required" placeholder="挂号须知" autocomplete="off" class="layui-input">
</div>
</div>
<!-- 邮箱输入项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 标签 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
邮箱
</label>
<!-- 输入框容器 -->
<div class="layui-input-block input">
<!-- 邮箱输入框 -->
<input type="text" v-model="detail.yishengEmail" name="yishengEmail" id="yishengEmail" lay-verify="required|email" placeholder="邮箱" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
邮箱
</label>
<div class="layui-input-block input">
<input type="text" v-model="detail.yishengEmail" name="yishengEmail" id="yishengEmail" lay-verify="required|email" placeholder="邮箱" autocomplete="off" class="layui-input">
</div>
</div>
<!-- 挂号价格输入项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 标签 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">挂号价格</label>
<!-- 输入框容器 -->
<div class="layui-input-inline input">
<!-- 挂号价格输入框，禁用状态 -->
<input type="number" v-model="detail.yishengNewMoney" name="yishengNewMoney" id="yishengNewMoney" placeholder="挂号价格" autocomplete="off" class="layui-input" disabled="disabled">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">挂号价格</label>
<div class="layui-input-inline input">
<input type="number" v-model="detail.yishengNewMoney" name="yishengNewMoney" id="yishengNewMoney" placeholder="挂号价格" autocomplete="off" class="layui-input" disabled="disabled">
</div>
<div class="layui-form-mid layui-word-aux">
<i class="layui-icon" style="font-size: 20px;color: red;">&#xe65e;</i>
<a id="btn-recharge" href="javascript:void(0)">点我充值</a>
</div>
<!-- 充值提示和链接 -->
<div class="layui-form-mid layui-word-aux">
<!-- 提示图标 -->
<i class="layui-icon" style="font-size: 20px;color: red;">&#xe65e;</i>
<!-- 充值链接 -->
<a id="btn-recharge" href="javascript:void(0)">点我充值</a>
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block" style="display: flex;flex-wrap:wrap;">
<button class="main_backgroundColor" :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"10px auto 0","borderColor":"#ccc","color":"#fff","borderRadius":"8px","borderWidth":"0","width":"30%","fontSize":"15px","borderStyle":"solid","height":"44px"}' class="layui-btn btn-submit btn-theme" lay-submit lay-filter="*">更新信息</button>
<button :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"10px auto","borderColor":"#ccc","backgroundColor":"rgba(255, 0, 0, 1)","color":"rgba(255, 255, 255, 1)","borderRadius":"8px","borderWidth":"0","width":"30%","fontSize":"14px","borderStyle":"solid","height":"44px"}' @click="logout" class="layui-btn btn-submit">退出登录</button>
</div>
<!-- 表单提交和退出登录按钮 -->
<div class="layui-form-item">
<div class="layui-input-block" style="display: flex;flex-wrap:wrap;">
<!-- 更新信息按钮 -->
<button class="main_backgroundColor" :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"10px auto 0","borderColor":"#ccc","color":"#fff","borderRadius":"8px","borderWidth":"0","width":"30%","fontSize":"15px","borderStyle":"solid","height":"44px"}' class="layui-btn btn-submit btn-theme" lay-submit lay-filter="*">更新信息</button>
<!-- 退出登录按钮 -->
<button :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"10px auto","borderColor":"#ccc","backgroundColor":"rgba(255, 0, 0, 1)","color":"rgba(255, 255, 255, 1)","borderRadius":"8px","borderWidth":"0","width":"30%","fontSize":"14px","borderStyle":"solid","height":"44px"}' @click="logout" class="layui-btn btn-submit">退出登录</button>
</div>
</form>
</div>
<!-- 个人中心 -->
</div>
</form>
</div>
<!-- 个人中心 -->
</div>
<!-- layui -->
<script src="../../layui/layui.js"></script>
<!-- vue -->
<script src="../../js/vue.js"></script>
<!-- 引入element组件库 -->
<script src="../../xznstatic/js/element.min.js"></script>
<!-- 组件配置信息 -->
<script src="../../js/config.js"></script>
<!-- 扩展插件配置信息 -->
<script src="../../modules/config.js"></script>
<!-- 工具方法 -->
<script src="../../js/utils.js"></script>
<!-- 校验格式工具类 -->
<script src="../../js/validate.js"></script>
</div>
<!-- 引入Layui的JS文件 -->
<script src="../../layui/layui.js"></script>
<!-- 引入Vue的JS文件 -->
<script src="../../js/vue.js"></script>
<!-- 引入Element UI的JS文件 -->
<script src="../../xznstatic/js/element.min.js"></script>
<!-- 引入组件配置信息文件 -->
<script src="../../js/config.js"></script>
<!-- 引入扩展插件配置信息文件 -->
<script src="../../modules/config.js"></script>
<!-- 引入工具方法文件 -->
<script src="../../js/utils.js"></script>
<!-- 引入校验格式工具类文件 -->
<script src="../../js/validate.js"></script>
<script>
var vue = new Vue({
el: '#app',
data: {
// 轮播图
swiperList: [],
detail: {
yishengUuidNumber: new Date().getTime(),//数字
username: '',
password: '',
yishengName: '',
yishengTypes: '',//数字
yishengValue: '',//数字对应的值
zhiweiTypes: '',//数字
zhiweiValue: '',//数字对应的值
yishengZhichneg: '',
yishengPhoto: '',
yishengPhone: '',
yishengGuahao: '',
yishengEmail: '',
yishengNewMoney: '',
yishengContent: '',
createTime: '',
},
yishengTypesList: [],
zhiweiTypesList: [],
centerMenu: centerMenu
<script>
// 创建Vue实例
var vue = new Vue({
// 挂载点
el: '#app',
// 数据部分
data: {
// 轮播图数据
swiperList: [],
// 个人信息详情
detail: {
yishengUuidNumber: new Date().getTime(),//数字
username: '',
password: '',
yishengName: '',
yishengTypes: '',//数字
yishengValue: '',//数字对应的值
zhiweiTypes: '',//数字
zhiweiValue: '',//数字对应的值
yishengZhichneg: '',
yishengPhoto: '',
yishengPhone: '',
yishengGuahao: '',
yishengEmail: '',
yishengNewMoney: '',
yishengContent: '',
createTime: '',
},
updated: function() {
// layui.form.render(null, 'myForm');
// 科室列表
yishengTypesList: [],
// 职位列表
zhiweiTypesList: [],
// 个人中心菜单数据
centerMenu: centerMenu
},
// 数据更新后的钩子函数
updated: function() {
// 重新渲染表单
// layui.form.render(null, 'myForm');
},
// 方法部分
methods: {
// 跳转页面方法
jump(url) {
jump(url)
},
methods: {
jump(url) {
jump(url)
},
logout(){
localStorage.removeItem('Token');
localStorage.removeItem('role');
localStorage.removeItem('sessionTable');
localStorage.removeItem('adminName');
localStorage.removeItem('userid');
localStorage.removeItem('userTable');
localStorage.removeItem('iframeUrl');
window.parent.location.href = '../login/login.html';
}
}
})
layui.use(['layer', 'element', 'carousel', 'http', 'jquery', 'laydate', 'form', 'upload'], function() {
var layer = layui.layer;
var element = layui.element;
var carousel = layui.carousel;
var http = layui.http;
var jquery = layui.jquery;
var form = layui.form;
var upload = layui.upload;
// 充值
jquery('#btn-recharge').click(function(e) {
layer.open({
type: 2,
title: '用户充值',
area: ['900px', '600px'],
content: '../recharge/recharge.html'
});
});
// 获取轮播图 数据
http.request('config/list', 'get', {
page: 1,
limit: 5
}, function(res) {
if (res.data.list.length > 0) {
let swiperList = [];
res.data.list.forEach(element => {
if (element.value != null) {
swiperList.push({
img: element.value
});
}
});
vue.swiperList = swiperList;
// 轮播图
vue.$nextTick(() => {
carousel.render({
elem: '#swiper',
width: '100%',
height: '450px',
arrow: 'hover',
anim: 'default',
autoplay: 'true',
interval: '3000',
indicator: 'inside'
});
})
}
});
// 查询字典表相关
// 科室的查询和初始化
yishengTypesSelect();
// 职位的查询和初始化
zhiweiTypesSelect();
// 日期效验规则及格式
dateTimePick();
// 表单效验规则
form.verify({
// 正整数效验规则
integer: [
/^[1-9][0-9]*$/
,'必须是正整数'
]
// 小数效验规则
,double: [
/^[0-9]{0,6}(\.[0-9]{1,2})?$/
,'最大整数位为6为,小数最大两位'
]
});
// 上传 文件/图片
// 医生头像的文件上传
var yishengPhotoUpload = upload.render({
//绑定元素
elem: '#yishengPhotoUpload',
//上传接口
url: http.baseurl + 'file/upload',
// 请求头
headers: {
Token: localStorage.getItem('Token')
},
// 允许上传时校验的文件类型
accept: 'images',
before: function() {
//loading层
var index = layer.load(1, {
shade: [0.1, '#fff'] //0.1透明度的白色背景
});
},
// 上传成功
done: function(res) {
console.log(res);
layer.closeAll();
if (res.code == 0) {
layer.msg("上传成功", {
time: 2000,
icon: 6
})
var url = http.baseurl + 'upload/' + res.file;
vue.detail.yishengPhoto = url;
} else {
layer.msg(res.msg, {
time: 2000,
icon: 5
})
}
},
//请求异常回调
error: function() {
layer.closeAll();
layer.msg("请求接口异常", {
time: 2000,
icon: 5
})
}
});
// 查询用户信息
let table = localStorage.getItem("userTable");
if(!table){
layer.msg('请先登录', {
time: 2000,
icon: 5
}, function() {
window.parent.location.href = '../login/login.html';
});
// 退出登录方法
logout(){
// 清除本地存储的登录信息
localStorage.removeItem('Token');
localStorage.removeItem('role');
localStorage.removeItem('sessionTable');
localStorage.removeItem('adminName');
localStorage.removeItem('userid');
localStorage.removeItem('userTable');
localStorage.removeItem('iframeUrl');
// 跳转到登录页面
window.parent.location.href = '../login/login.html';
}
http.request(`yisheng/session`, 'get', {}, function(data) {
// 表单赋值
// form.val("myForm", data.data);
vue.detail = data.data
// 图片赋值
//jquery("#yishengPhotoImg").attr("src", data.data.yishengPhoto);
});
// 提交表单
form.on('submit(*)', function(data) {
data = vue.detail;
data['createTime']=jquery("#createTime").val();
http.requestJson(table + '/update', 'post', data, function(res) {
layer.msg('修改成功', {
time: 2000,
icon: 6
}, function() {
window.location.reload();
});
});
return false
});
});
// 日期框初始化
function dateTimePick(){
}
//科室的查询
function yishengTypesSelect() {
//填充下拉框选项
layui.http.request("dictionary/page?page=1&limit=100&sort=&order=&dicCode=yisheng_types", "GET", {}, (res) => {
if(res.code == 0){
vue.yishengTypesList = res.data.list;
}
});
}
//职位的查询
function zhiweiTypesSelect() {
//填充下拉框选项
layui.http.request("dictionary/page?page=1&limit=100&sort=&order=&dicCode=zhiwei_types", "GET", {}, (res) => {
if(res.code == 0){
vue.zhiweiTypesList = res.data.list;
}
});
}
})
</script>
</body>
</html>
// 使用Layui的模块
layui.use(['layer', 'element', 'carousel', 'http', 'jquery', 'laydate', 'form', 'upload'], function() {
// 获取Layui的模块
var layer = layui.layer;
var element = layui.element;
var carousel = layui.carousel;
var http = layui.http;
var jquery = layui.jquery;

33
src/main/resources/mapper/YishengDao.xml
Unescape View File

@ -1,8 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.dao.YishengDao">
<!-- 通用查询结果列 -->
<!-- 定义了一个 SQL 片段，包含了从数据库表中查询的列，将这些列别名为实体类中的属性名，方便结果映射 -->
<sql id="Base_Column_List">
a.id as id
,a.yisheng_uuid_number as yishengUuidNumber
@ -20,64 +20,77 @@
,a.yisheng_content as yishengContent
,a.create_time as createTime
</sql>
<select id="selectListView" parameterType="map" resultType="com.entity.view.YishengView" >
<!-- 定义一个查询方法，id 为 "selectListView"，参数类型为 Map，返回类型为 com.entity.view.YishengView -->
<select id="selectListView" parameterType="map" resultType="com.entity.view.YishengView">
SELECT
<!-- 引入上面定义的通用查询结果列 SQL 片段 -->
<include refid="Base_Column_List" />
-- 级联表的字段
-- 级联表的字段
FROM yisheng a
<!-- 条件查询部分 -->
<where>
<!-- 如果参数中存在 "ids"，并且其值不为空，构建 in 条件 -->
<if test="params.ids != null">
and a.id in
<foreach item="item" index="index" collection="params.ids" open="(" separator="," close=")">
#{item}
#{item}
</foreach>
</if>
<!-- 如果参数中 "yishengUuidNumber" 不为空字符串、不为 null 且不等于 "null" 字符串，构建模糊查询条件 -->
<if test=" params.yishengUuidNumber != '' and params.yishengUuidNumber != null and params.yishengUuidNumber != 'null' ">
and a.yisheng_uuid_number like CONCAT('%',#{params.yishengUuidNumber},'%')
</if>
<!-- 如果参数中 "username" 不为空字符串、不为 null 且不等于 "null" 字符串，构建模糊查询条件 -->
<if test=" params.username != '' and params.username != null and params.username != 'null' ">
and a.username like CONCAT('%',#{params.username},'%')
</if>
<!-- 如果参数中 "password" 不为空字符串、不为 null 且不等于 "null" 字符串，构建模糊查询条件 -->
<if test=" params.password != '' and params.password != null and params.password != 'null' ">
and a.password like CONCAT('%',#{params.password},'%')
</if>
<!-- 如果参数中 "yishengName" 不为空字符串、不为 null 且不等于 "null" 字符串，构建模糊查询条件 -->
<if test=" params.yishengName != '' and params.yishengName != null and params.yishengName != 'null' ">
and a.yisheng_name like CONCAT('%',#{params.yishengName},'%')
</if>
<!-- 如果参数中 "yishengTypes" 不为空且不为空字符串，构建等于条件 -->
<if test="params.yishengTypes != null and params.yishengTypes != ''">
and a.yisheng_types = #{params.yishengTypes}
</if>
<!-- 如果参数中 "zhiweiTypes" 不为空且不为空字符串，构建等于条件 -->
<if test="params.zhiweiTypes != null and params.zhiweiTypes != ''">
and a.zhiwei_types = #{params.zhiweiTypes}
</if>
<!-- 如果参数中 "yishengZhichneg" 不为空字符串、不为 null 且不等于 "null" 字符串，构建模糊查询条件 -->
<if test=" params.yishengZhichneg != '' and params.yishengZhichneg != null and params.yishengZhichneg != 'null' ">
and a.yisheng_zhichneg like CONCAT('%',#{params.yishengZhichneg},'%')
</if>
<!-- 如果参数中 "yishengPhone" 不为空字符串、不为 null 且不等于 "null" 字符串，构建模糊查询条件 -->
<if test=" params.yishengPhone != '' and params.yishengPhone != null and params.yishengPhone != 'null' ">
and a.yisheng_phone like CONCAT('%',#{params.yishengPhone},'%')
</if>
<!-- 如果参数中 "yishengGuahao" 不为空字符串、不为 null 且不等于 "null" 字符串，构建模糊查询条件 -->
<if test=" params.yishengGuahao != '' and params.yishengGuahao != null and params.yishengGuahao != 'null' ">
and a.yisheng_guahao like CONCAT('%',#{params.yishengGuahao},'%')
</if>
<!-- 如果参数中 "yishengEmail" 不为空字符串、不为 null 且不等于 "null" 字符串，构建模糊查询条件 -->
<if test=" params.yishengEmail != '' and params.yishengEmail != null and params.yishengEmail != 'null' ">
and a.yisheng_email like CONCAT('%',#{params.yishengEmail},'%')
</if>
<!-- 如果参数中 "yishengNewMoneyStart" 不为空，构建大于等于条件，使用 CDATA 防止特殊字符转义 -->
<if test="params.yishengNewMoneyStart != null ">
<![CDATA[ and a.yisheng_new_money >= #{params.yishengNewMoneyStart} ]]>
</if>
<!-- 如果参数中 "yishengNewMoneyEnd" 不为空，构建小于等于条件，使用 CDATA 防止特殊字符转义 -->
<if test="params.yishengNewMoneyEnd != null ">
<![CDATA[ and a.yisheng_new_money <= #{params.yishengNewMoneyEnd} ]]>
</if>
<!-- 如果参数中 "yishengContent" 不为空字符串、不为 null 且不等于 "null" 字符串，构建模糊查询条件 -->
<if test=" params.yishengContent != '' and params.yishengContent != null and params.yishengContent != 'null' ">
and a.yisheng_content like CONCAT('%',#{params.yishengContent},'%')
</if>
</where>
order by a.${params.orderBy} desc
<!-- 根据参数中的 "orderBy" 字段进行降序排序 -->
order by a.${params.orderBy} desc
</select>
</mapper>

501
target/classes/front/front/pages/yisheng/add.html
Unescape View File

@ -1,20 +1,27 @@
<!DOCTYPE html>
<html>
<head>
<!-- 设置字符编码为UTF-8，确保页面能正确显示各种字符 -->
<meta charset="utf-8">
<!-- 设置页面在不同设备上的显示适配，width=device-width表示宽度与设备宽度一致，initial-scale=1表示初始缩放比例为1，maximum-scale=1表示最大缩放比例为1 -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- 设置页面标题为医生添加 -->
<title>医生添加</title>
<!-- bootstrap样式，地图插件使用 -->
<!-- 引入bootstrap样式文件，用于地图插件等相关样式 -->
<link rel="stylesheet" href="../../css/bootstrap.min.css" />
<!-- 引入layui的CSS样式文件，layui是一个前端框架，提供了丰富的组件和样式 -->
<link rel="stylesheet" href="../../layui/css/layui.css">
<!-- 样式 -->
<!-- 引入自定义的样式文件style.css，用于页面的特定样式设置 -->
<link rel="stylesheet" href="../../css/style.css" />
<!-- 主题（主要颜色设置） -->
<!-- 引入主题样式文件theme.css，主要用于设置页面的主要颜色等主题相关样式 -->
<link rel="stylesheet" href="../../css/theme.css" />
<!-- 通用的css -->
<!-- 引入通用的CSS文件common.css，包含一些通用的样式规则 -->
<link rel="stylesheet" href="../../css/common.css" />
</head>
<style>
/* 设置页面背景的伪元素样式，固定在页面上，覆盖整个页面，用于设置背景图片等 */
html::after {
position: fixed;
top: 0;
@ -28,34 +35,43 @@
background-position: center;
z-index: -1;
}
/* 轮播图容器样式，设置溢出隐藏，水平居中 */
#swiper {
overflow: hidden;
margin: 0 auto;
}
/* 轮播图指示器（小圆点）的普通样式，设置大小、边框、背景等 */
#swiper .layui-carousel-ind li {
width: 20px;
height: 10px;
border-width: 0;
border-style: solid;
border-color: rgba(0,0,0,.3);
border-color: rgba(0, 0, 0,.3);
border-radius: 6px;
background-color: #f7f7f7;
box-shadow: 0 0 6px rgba(255,0,0,.8);
box-shadow: 0 0 6px rgba(255, 0, 0,.8);
}
/* 轮播图指示器中当前激活项的样式，与普通样式有区别，这里设置了不同的宽度 */
#swiper .layui-carousel-ind li.layui-this {
width: 30px;
height: 10px;
border-width: 0;
border-style: solid;
border-color: rgba(0,0,0,.3);
border-color: rgba(0, 0, 0,.3);
border-radius: 6px;
}
button, button:focus {
/* 按钮和按钮获得焦点时的样式，去除默认的轮廓 */
button,
button:focus {
outline: none;
}
.data-add-container .add .layui-select-title .layui-unselect {
/* 数据添加容器中选择框的标题样式，设置内边距、高度、字体大小、边框等 */
.data-add-container .add.layui-select-title.layui-unselect {
padding: 0 12px;
height: 40px;
font-size: 15px;
@ -64,408 +80,123 @@
border-style: solid;
text-align: center;
}
.data-add-container .add .layui-form-item {
/* 数据添加容器中表单元素的样式，设置为弹性布局，水平和垂直居中 */
.data-add-container .add.layui-form-item {
display: flex;
align-items: center;
justify-content: center;
}
.data-add-container .layui-form-pane .layui-form-item[pane] .layui-form-label {
/* 数据添加容器中特定表单面板的表单元素标签样式，去除默认的外边距、定位、背景和边框 */
.data-add-container.layui-form-pane.layui-form-item[pane].layui-form-label {
margin: 0;
position: inherit;
background: transparent;
border: 0;
}
.data-add-container .add .layui-input-block {
/* 数据添加容器中输入框容器的样式，设置为弹性布局，占据剩余空间 */
.data-add-container .add.layui-input-block {
margin: 0;
flex: 1;
}
.data-add-container .layui-form-pane .layui-form-item[pane] .layui-input-inline {
/* 数据添加容器中特定表单面板的表单元素内联输入框容器的样式，设置为弹性布局，占据剩余空间 */
.data-add-container.layui-form-pane.layui-form-item[pane].layui-input-inline {
margin: 0;
flex: 1;
display: flex;
}
</style>
<body style="background: #EEEEEE; ">
<div id="app">
<div class="layui-carousel" id="swiper" :style='{"boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 auto","borderColor":"rgba(0,0,0,.3)","borderRadius":"0px","borderWidth":"0","width":"100%","borderStyle":"solid"}'>
<div carousel-item id="swiper-item">
<div v-for="(item,index) in swiperList" :key="index">
<img style="width: 100%;height: 100%;object-fit:cover;" :src="item.img" />
</div>
<body style="background: #EEEEEE; ">
<!-- Vue实例挂载的根元素 -->
<div id="app">
<!-- 轮播图容器，使用layui的轮播图组件，设置样式属性 -->
<div class="layui-carousel" id="swiper" :style='{"boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 auto","borderColor":"rgba(0,0,0,.3)","borderRadius":"0px","borderWidth":"0","width":"100%","borderStyle":"solid"}'>
<!-- 轮播图的项目容器，id为swiper-item -->
<div carousel-item id="swiper-item">
<!-- 使用v-for循环渲染轮播图的每一项，根据swiperList数据动态生成 -->
<div v-for="(item, index) in swiperList" :key="index">
<img style="width: 100%; height: 100%; object-fit: cover;" :src="item.img" />
</div>
</div>
<!-- 轮播图 -->
<div class="data-add-container sub_borderColor" :style='{"padding":"20px","margin":"30px auto","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"10px","borderWidth":"1px","borderStyle":"solid"}'>
<form class="layui-form layui-form-pane add" lay-filter="myForm">
0
<!-- 当前表的 -->
<!-- 唯一uuid -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生工号：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengUuidNumber" lay-verify="required" type="text" :readonly="ro.yishengUuidNumber" name="yishengUuidNumber" id="yishengUuidNumber" autocomplete="off">
</div>
</div>
<!-- 轮播图结束 -->
<!-- 数据添加容器，设置样式属性，用于包裹医生信息添加表单 -->
<div class="data-add-container sub_borderColor" :style='{"padding":"20px","margin":"30px auto","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"10px","borderWidth":"1px","borderStyle":"solid"}'>
<!-- 使用layui的表单组件，设置表单过滤器为myForm，用于表单验证和提交等操作 -->
<form class="layui-form layui-form-pane add" lay-filter="myForm">
<!-- 医生工号输入项的表单元素 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 标签，设置宽度、内边距、字体大小、颜色和文本对齐方式 -->
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生工号：
</label>
<!-- 输入框容器 -->
<div class="layui-input-block">
<!-- 医生工号输入框，使用v-model双向绑定数据，设置样式、验证规则、只读状态等 -->
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengUuidNumber" lay-verify="required" type="text" :readonly="ro.yishengUuidNumber" name="yishengUuidNumber" id="yishengUuidNumber" autocomplete="off">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
账户：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
</div>
<!-- 账户输入项的表单元素，结构和样式设置与医生工号类似 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
账户：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.username" type="text" :readonly="ro.username" name="username" id="username" autocomplete="off">
</div>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生名称：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
</div>
<!-- 医生名称输入项的表单元素 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生名称：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengName" type="text" :readonly="ro.yishengName" name="yishengName" id="yishengName" autocomplete="off">
</div>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职位：
</label>
<div class="layui-input-block">
<select name="zhiweiTypes" id="zhiweiTypes" lay-filter="zhiweiTypes">
<option value="">请选择</option>
<option v-for="(item,index) in zhiweiTypesList" v-bind:key="index" :value="item.codeIndex" :key="item.codeIndex">{{ item.indexName }}</option>
</select>
</div>
</div>
<!-- 职位选择项的表单元素 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职位：
</label>
<div class="layui-input-block">
<!-- 职位选择框，使用select元素，设置lay-filter用于监听选择事件，v-for循环渲染选项 -->
<select name="zhiweiTypes" id="zhiweiTypes" lay-filter="zhiweiTypes">
<option value="">请选择</option>
<option v-for="(item, index) in zhiweiTypesList" v-bind:key="index" :value="item.codeIndex" :key="item.codeIndex">{{ item.indexName }}</option>
</select>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职称：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
</div>
<!-- 职称输入项的表单元素 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职称：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengZhichneg" type="text" :readonly="ro.yishengZhichneg" name="yishengZhichneg" id="yishengZhichneg" autocomplete="off">
</div>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生头像：
</label>
<div class="layui-input-block">
<div v-if="detail.yishengPhoto" style="display:inline-block;margin-right:10px;">
<img id="yishengPhotoImg" style="width: 100px;height: 100px;border-radius: 50%;border: 2px solid #EEEEEE;" :src="detail.yishengPhoto">
<input type="hidden" :value="detail.yishengPhoto" id="yishengPhoto" name="yishengPhoto" />
</div>
<button v-if="!ro.yishengPhoto" :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"0 10px 0 0","borderColor":"#ccc","color":"#fff","borderRadius":"8px","borderWidth":"0","width":"auto","fontSize":"14px","borderStyle":"solid","height":"44px"}' type="button" class="layui-btn btn-theme main_backgroundColor" id="yishengPhotoUpload">
<i v-if="true" :style='{"color":"#fff","show":true,"fontSize":"14px"}' class="layui-icon">&#xe67c;</i>上传医生头像
</button>
</div>
</div>
<!-- 手机号 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
联系方式：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengPhone" lay-verify="phone|required" type="text" :readonly="ro.yishengPhone" name="yishengPhone" id="yishengPhone" autocomplete="off">
</div>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
挂号须知：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengGuahao" type="text" :readonly="ro.yishengGuahao" name="yishengGuahao" id="yishengGuahao" autocomplete="off">
</div>
</div>
<!-- 邮箱 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
邮箱：
</label>
<div class="layui-input-block">
<input class="layui-input main_borderColor" :style='{"padding":"0 12px","boxShadow":"0 0 0px rgba(160, 67, 26, 1)","backgroundColor":"#fff","color":"rgba(135, 206, 250, 1)","borderRadius":"4px","textAlign":"left","borderWidth":"1px","fontSize":"15px","borderStyle":"solid","height":"40px"}'
v-model="detail.yishengEmail" lay-verify="email|required" type="text" :readonly="ro.yishengEmail" name="yishengEmail" id="yishengEmail" autocomplete="off">
</div>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<div class="layui-input-block" style="text-align: right;">
<button :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"0 10px","borderColor":"#ccc","backgroundColor":"rgba(75, 92, 196, 1)","color":"#fff","borderRadius":"8px","borderWidth":"0","width":"25%","fontSize":"14px","borderStyle":"solid","height":"44px"}' class="layui-btn btn-submit" lay-submit lay-filter="thisSubmit">提交</button>
</div>
<!-- 医生头像相关的表单元素 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"rgba(255, 255, 255, 0)","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","borderColor": "rgba(255, 255, 255, 0)","padding":"0 12px 0 0","backgroundColor":"rgba(255, 255, 255, 0)","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生头像：
</label>
<div class="layui-input-block">
<!-- 如果存在医生头像数据，则显示头像图片和隐藏的头像路径输入框 -->
<div v-if="detail.yishengPhoto" style="display: inline-block; margin-right: 10px;">
<img id="yishengPhotoImg" style="width: 100px; height: 100px; border-radius: 50%; border: 2px solid #EEEEEE;" :src="detail.yishengPhoto">
<input type="hidden" :value="detail.yishengPhoto" id="yishengPhoto" name="yishengPhoto" />
</div>
</div>
</form>
</div>
</div>
<script src="../../layui/layui.js"></script>
<script src="../../js/vue.js"></script>
<!-- 引入element组件库 -->
<script src="../../xznstatic/js/element.min.js"></script>
<!-- 引入element样式 -->
<link rel="stylesheet" href="../../xznstatic/css/element.min.css">
<!-- 组件配置信息 -->
<script src="../../js/config.js"></script>
<!-- 扩展插件配置信息 -->
<script src="../../modules/config.js"></script>
<!-- 工具方法 -->
<script src="../../js/utils.js"></script>
<!-- 校验格式工具类 -->
<script src="../../js/validate.js"></script>
<!-- 地图 -->
<script type="text/javascript" src="../../js/jquery.js"></script>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=ca04cee7ac952691aa67a131e6f0cee0"></script>
<script type="text/javascript" src="../../js/bootstrap.min.js"></script>
<script type="text/javascript" src="../../js/bootstrap.AMapPositionPicker.js"></script>
<script>
var jquery = $;
var vue = new Vue({
el: '#app',
data: {
// 轮播图
swiperList: [{
img: '../../img/banner.jpg'
}],
dataList: [],
ro:{
yishengUuidNumber: true,
username: false,
password: false,
yishengName: false,
yishengTypes: false,
zhiweiTypes: false,
yishengZhichneg: false,
yishengPhoto: false,
yishengPhone: false,
yishengGuahao: false,
yishengEmail: false,
yishengNewMoney: false,
yishengContent: false,
createTime: false,
},
detail: {
yishengUuidNumber: new Date().getTime(),//数字
username: '',
password: '',
yishengName: '',
yishengTypes: '',//数字
yishengValue: '',//数字对应的值
zhiweiTypes: '',//数字
zhiweiValue: '',//数字对应的值
yishengZhichneg: '',
yishengPhoto: '',
yishengPhone: '',
yishengGuahao: '',
yishengEmail: '',
yishengNewMoney: '',
yishengContent: '',
createTime: '',
},
// 级联表的
// 下拉框
yishengTypesList: [],
zhiweiTypesList: [],
centerMenu: centerMenu
},
updated: function() {
layui.form.render('select', 'myForm');
},
computed: {
},
methods: {
jump(url) {
jump(url)
}
}
})
layui.use(['layer', 'element', 'carousel', 'http', 'jquery', 'form', 'upload', 'laydate','tinymce'], function() {
var layer = layui.layer;
var element = layui.element;
var carousel = layui.carousel;
var http = layui.http;
var jquery = layui.jquery;
var form = layui.form;
var upload = layui.upload;
var laydate = layui.laydate;
var tinymce = layui.tinymce
// 获取轮播图 数据
http.request('config/list', 'get', {
page: 1,
limit: 5
}, function (res) {
if (res.data.list.length > 0) {
let swiperList = [];
res.data.list.forEach(element => {
if(element.value != null){
swiperList.push({
img: element.value
});
}
});
vue.swiperList = swiperList;
vue.$nextTick(() => {
carousel.render({
elem: '#swiper',
width: '100%',
height: '450px',
arrow: 'hover',
anim: 'default',
autoplay: 'true',
interval: '3000',
indicator: 'inside'
});
});
}
});
// 下拉框
// 科室的查询和初始化
yishengTypesSelect();
// 职位的查询和初始化
zhiweiTypesSelect();
// 上传文件
// 医生头像的文件上传
upload.render({
//绑定元素
elem: '#yishengPhotoUpload',
//上传接口
url: http.baseurl + 'file/upload',
// 请求头
headers: {
Token: localStorage.getItem('Token')
},
// 允许上传时校验的文件类型
accept: 'images',
before: function () {
//loading层
var index = layer.load(1, {
shade: [0.1, '#fff'] //0.1透明度的白色背景
});
},
// 上传成功
done: function (res) {
console.log(res);
layer.closeAll();
if (res.code == 0) {
layer.msg("上传成功", {
time: 2000,
icon: 6
})
var url = http.baseurl + 'upload/' + res.file;
jquery('#yishengPhoto').val(url);
vue.detail.yishengPhoto = url;
jquery('#yishengPhotoImg').attr('src', url);
} else {
layer.msg(res.msg, {
time: 2000,
icon: 5
})
}
},
//请求异常回调
error: function () {
layer.closeAll();
layer.msg("请求接口异常", {
time: 2000,
icon: 5
})
}
});
// 日期效验规则及格式
dateTimePick();
// 表单效验规则
form.verify({
// 正整数效验规则
integer: [
/^[1-9][0-9]*$/
,'必须是正整数'
]
// 小数效验规则
,double: [
/^[1-9][0-9]{0,5}(\.[0-9]{1,2})?$/
,'最大整数位为6为,小数最大两位'
]
});
// session独取
let table = localStorage.getItem("userTable");
http.request(table+"/session", 'get', {}, function (data) {
// 表单赋值
//form.val("myForm", data.data);
// data = data.data;
for (var key in data) {
vue.detail[table+"Id"] = data.id
}
});
// 提交
form.on('submit(thisSubmit)', function (data) {
data = data.field;
data["Id"]= localStorage.getItem("userid");
// 提交数据
http.requestJson('yisheng' + '/add', 'post', data, function (res) {
layer.msg('提交成功', {
time: 2000,
icon: 6
}, function () {
back();
});
});
return false
});
});
// 日期框初始化
function dateTimePick(){
var myDate = new Date(); //获取当前时间
/*
,change: function(value, date, endDate){
value 得到日期生成的值，如：2017-08-18
date 得到日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
endDate 得结束的日期时间对象，开启范围选择（range: true）才会返回。对象成员同上。
*/
}
// 科室的查询
function yishengTypesSelect() {
//填充下拉框选项
layui.http.request("dictionary/page?page=1&limit=100&sort=&order=&dicCode=yisheng_types", "GET", {}, (res) => {
if(res.code == 0){
vue.yishengTypesList = res.data.list;
}
});
}
// 职位的查询
function zhiweiTypesSelect() {
//填充下拉框选项
layui.http.request("dictionary/page?page=1&limit=100&sort=&order=&dicCode=zhiwei_types", "GET", {}, (res) => {
if(res.code == 0){
vue.zhiweiTypesList = res.data.list;
}
});
}
</script>
</body>
</html>
<!-- 如果头像不是只读状态，则显示上传头像按钮 -->
<button v-if="!ro.yishengPhoto" :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"0 1

810
target/classes/front/front/pages/yisheng/center.html
Unescape View File

@ -1,22 +1,26 @@
<!-- 个人中心 -->
<!DOCTYPE html>
<html>
<head>
<!-- 设置字符编码为UTF - 8 -->
<meta charset="utf-8">
<!-- 设置页面在移动设备上的显示效果，宽度为设备宽度，初始缩放比例为1，最大缩放比例为1 -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- 设置页面标题为个人中心 -->
<title>个人中心</title>
<!-- 引入layui的CSS样式文件 -->
<link rel="stylesheet" href="../../layui/css/layui.css">
<!-- 引入element样式 -->
<!-- 引入element的CSS样式文件 -->
<link rel="stylesheet" href="../../xznstatic/css/element.min.css">
<!-- 样式 -->
<!-- 引入自定义的样式文件 -->
<link rel="stylesheet" href="../../css/style.css" />
<!-- 主题（主要颜色设置） -->
<!-- 引入主题样式文件，用于设置主要颜色等 -->
<link rel="stylesheet" href="../../css/theme.css" />
<!-- 通用的css -->
<!-- 引入通用的CSS样式文件 -->
<link rel="stylesheet" href="../../css/common.css" />
</head>
<style>
/* 在HTML元素后添加一个固定位置的伪元素，作为背景层，设置背景的相关属性 */
html::after {
position: fixed;
top: 0;
@ -30,9 +34,11 @@
background-position: center;
z-index: -1;
}
/* 轮播图容器样式，设置溢出内容隐藏 */
#swiper {
overflow: hidden;
}
/* 轮播图指示器的普通样式，设置宽度、高度、边框、圆角、背景色和阴影 */
#swiper .layui-carousel-ind li {
width: 20px;
height: 10px;
@ -43,6 +49,7 @@
background-color: #f7f7f7;
box-shadow: 0 0 6px rgba(255,0,0,.8);
}
/* 轮播图指示器当前激活项的样式，设置宽度和其他样式 */
#swiper .layui-carousel-ind li.layui-this {
width: 30px;
height: 10px;
@ -51,7 +58,7 @@
border-color: rgba(0,0,0,.3);
border-radius: 6px;
}
/* 页面标题容器的样式，设置文本居中、宽度和弹性布局 */
.index-title {
text-align: center;
box-sizing: border-box;
@ -61,16 +68,20 @@
align-items: center;
flex-direction: column;
}
/* 页面标题中span元素的样式，设置内边距和行高 */
.index-title span {
padding: 0 10px;
line-height: 1.4;
}
/* 个人中心容器中导航树的样式，设置宽度为100% */
.center-container .layui-nav-tree {
width: 100%;
}
/* 个人中心容器中导航的样式，设置定位为继承 */
.center-container .layui-nav {
position: inherit;
}
/* 个人中心容器中导航树导航项的样式，设置高度、行高、字体大小、边框、背景色和文本对齐方式 */
.center-container .layui-nav-tree .layui-nav-item {
height: 44px;
line-height: 44px;
@ -82,10 +93,12 @@
background-color: #fff;
text-align: center;
}
/* 个人中心容器中导航树导航条的样式，设置高度和透明度 */
.center-container .layui-nav-tree .layui-nav-bar {
height: 44px !important;
opacity: 0 !important;
}
/* 个人中心容器中导航树当前激活导航项的样式，设置字体大小、颜色、边框和圆角 */
.center-container .layui-nav-tree .layui-nav-item.layui-this {
font-size: 16px;
color: rgba(17, 17, 17, 1);
@ -93,6 +106,7 @@
border-style: solid;
border-radius: 0;
}
/* 个人中心容器中导航树导航项鼠标悬停时的样式，设置字体大小和颜色 */
.center-container .layui-nav-tree .layui-nav-item:hover {
font-size: 14px;
color: #fff;
@ -100,6 +114,7 @@
border-style: solid;
border-radius: 0;
}
/* 个人中心容器中导航树导航项链接的样式，设置行高、高度、背景色、颜色和去除下划线 */
.center-container .layui-nav-tree .layui-nav-item a {
line-height: inherit;
height: auto;
@ -107,18 +122,21 @@
color: inherit;
text-decoration: none;
}
/* 右侧容器的样式，设置为相对定位 */
.right-container {
position: relative;
}
/* 右侧容器中表单元素项的样式，设置为弹性布局并垂直居中对齐 */
.right-container .layui-form-item {
display: flex;
align-items: center;
}
/* 右侧容器中输入框所在块的样式，设置外边距为0，弹性增长系数为1 */
.right-container .layui-input-block {
margin: 0;
flex: 1;
}
/* 右侧容器中普通输入框的样式，设置内边距、高度、字体大小、边框、背景色和文本对齐方式 */
.right-container .input .layui-input {
padding: 0 12px;
height: 40px;
@ -129,6 +147,7 @@
background-color: #fff;
text-align: left;
}
/* 右侧容器中选择框的样式，设置内边距、高度、字体大小、边框、背景色和文本对齐方式 */
.right-container .select .layui-input {
padding: 0 12px;
height: 40px;
@ -139,6 +158,7 @@
background-color: #fff;
text-align: left;
}
/* 右侧容器中日期输入框的样式，设置内边距、高度、字体大小、颜色、边框、背景色、阴影和文本对齐方式 */
.right-container .date .layui-input {
padding: 0 12px;
height: 40px;
@ -151,443 +171,371 @@
box-shadow: 0 0 0px rgba(255,0,0,.8);
text-align: left;
}
.header {animation-name: fadeInUp; padding-bottom: 26px;padding-top: 70px;position:relative;border-bottom:1px solid rgba(0,0,0,0.1);margin-bottom:40px;}
#plheader{ top: 48px;padding-bottom: 40px;width: 220px;position: relative;height: 70px;border-radius: 3px 3px 0px 0px;padding-top: 40px !important;}
.header p.title {color: #fff;font-size: 25px;margin-bottom: 8px;text-align: left;white-space: nowrap;overflow: hidden;margin-left: 31px;font-weight: bold; padding-bottom: 8px;margin-top: 0px;width: 158px;border-bottom: 1px solid rgba(255, 255, 255, 0.16);letter-spacing:1px;}
#category {padding-top: 136px;margin-left: 0px;padding-bottom: 30px;width: 205px;float: left;padding-left: 15px;text-align: left;margin-top: -120px;background-color: var(--publicMainColor);border-radius: 0px 0px 3px 3px;}
.header p.subtitle {font-family:HELVETICANEUELTPRO-THEX, "微软雅黑";letter-spacing: 1px;font-size: 15px;display: inline-block;padding-top: 0px;color: #ffffff; margin-top: 0px; margin-right:31px;float: right;overflow: hidden;width: 156px;text-align: left;}
#category a.active::before {display: none;}
#category a.active::after {display:none;}
#category a.active, #category a:hover {background: var(--publicSubColor);color: #FFFFFF;border-color: #838383;transition: 0.3s; transform-origin: bottom;}
#category li {height:auto;position:relative;float:none; display:block;margin-top:1px;margin-bottom:1px;line-height:43px;border-bottom: 1px solid rgba(255, 255, 255, 0.05);padding-left: 15px;margin-right:16px;transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;}
#category li:last-child { border-bottom:none;}
#category a { border:0px; background:none; color:#CFDCF9; font-size:14px; position:relative; padding:0;line-height: 42px;height: 42px;}
#category a::before { content:''; position:absolute; content: '';position: absolute;width: 190px;background-color: #AEAEAF;height: 42px;background: transparent;left: -16px;position: absolute;transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; }
#category a.active::before {display: none;}
#category li:hover {padding-left:30px;background-color: var(--publicSubColor);transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;}
#category .bbbb, #category li .aaaa {padding-left:30px;background-color: var(--publicSubColor);transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;background: var(--publicSubColor);color: #FFFFFF; transition: 0.3s; transform-origin: bottom;}
#category li:hover ul li{width: 136px;}
#category li:hover ul li a{color: rgba(255, 255, 255, 0.45);width: 136px;overflow: hidden; background-color: rgb(34, 73, 160); padding-left:0px;}
#category li ul li:hover a{ padding-left:0px; margin-left: 0px;}
#category li:hover a{color:#fff}
/* 头部区域的样式，设置动画效果、内边距、位置和底部边框 */
.header {
animation-name: fadeInUp;
padding-bottom: 26px;
padding-top: 70px;
position: relative;
border-bottom: 1px solid rgba(0,0,0,0.1);
margin-bottom: 40px;
}
/* 特定头部区域的样式，设置顶部位置、内边距、宽度、高度和圆角 */
#plheader {
top: 48px;
padding-bottom: 40px;
width: 220px;
position: relative;
height: 70px;
border-radius: 3px 3px 0px 0px;
padding-top: 40px !important;
}
/* 头部标题的样式，设置颜色、字体大小、边距、文本溢出处理、字体加粗、底部边框和字母间距 */
.header p.title {
color: #fff;
font-size: 25px;
margin-bottom: 8px;
text-align: left;
white-space: nowrap;
overflow: hidden;
margin-left: 31px;
font-weight: bold;
padding-bottom: 8px;
margin-top: 0px;
width: 158px;
border-bottom: 1px solid rgba(255, 255, 255, 0.16);
letter-spacing:1px;
}
/* 分类菜单区域的样式，设置内边距、位置、宽度、浮动、背景色和圆角 */
#category {
padding-top: 136px;
margin-left: 0px;
padding-bottom: 30px;
width: 205px;
float: left;
padding-left: 15px;
text-align: left;
margin-top: -120px;
background-color: var(--publicMainColor);
border-radius: 0px 0px 3px 3px;
}
/* 头部副标题的样式，设置字体、字母间距、字体大小、显示方式、颜色、边距、浮动、文本溢出处理和文本对齐方式 */
.header p.subtitle {
font-family:HELVETICANEUELTPRO-THEX, "微软雅黑";
letter-spacing: 1px;
font-size: 15px;
display: inline-block;
padding-top: 0px;
color: #ffffff;
margin-top: 0px;
margin-right:31px;
float: right;
overflow: hidden;
width: 156px;
text-align: left;
}
/* 分类菜单中激活链接的前伪元素样式，设置为不显示 */
#category a.active::before {
display: none;
}
/* 分类菜单中激活链接的后伪元素样式，设置为不显示 */
#category a.active::after {
display: none;
}
/* 分类菜单中激活链接和鼠标悬停时链接的样式，设置背景色、颜色、边框颜色和过渡效果 */
#category a.active, #category a:hover {
background: var(--publicSubColor);
color: #FFFFFF;
border-color: #838383;
transition: 0.3s;
transform-origin: bottom;
}
/* 分类菜单列表项的样式，设置高度、位置、浮动、显示方式、边距、行高、底部边框、内边距和过渡效果 */
#category li {
height:auto;
position:relative;
float:none;
display:block;
margin-top:1px;
margin-bottom:1px;
line-height:43px;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
padding-left: 15px;
margin-right:16px;
transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
}
/* 分类菜单列表项最后一项的样式，去除底部边框 */
#category li:last-child {
border-bottom:none;
}
/* 分类菜单链接的样式，设置边框、背景、颜色、字体大小、位置、内边距、行高和高度 */
#category a {
border:0px;
background:none;
color:#CFDCF9;
font-size:14px;
position:relative;
padding:0;
line-height: 42px;
height: 42px;
}
/* 分类菜单链接的前伪元素样式，设置位置、宽度、背景色、高度和过渡效果 */
#category a::before {
content:'';
position:absolute;
content: '';
position: absolute;
width: 190px;
background-color: #AEAEAF;
height: 42px;
background: transparent;
left: -16px;
position: absolute;
transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
}
/* 分类菜单中激活链接的前伪元素样式，设置为不显示 */
#category a.active::before {
display: none;
}
/* 分类菜单列表项鼠标悬停时的样式，设置内边距和背景色过渡效果 */
#category li:hover {
padding-left:30px;
background-color: var(--publicSubColor);
transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
}
/* 特定类名的分类菜单列表项和链接的样式，设置内边距、背景色、颜色和过渡效果 */
#category .bbbb, #category li .aaaa {
padding-left:30px;
background-color: var(--publicSubColor);
transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
background: var(--publicSubColor);
color: #FFFFFF;
transition: 0.3s;
transform-origin: bottom;
}
/* 分类菜单列表项鼠标悬停时子列表项的样式，设置宽度 */
#category li:hover ul li{
width: 136px;
}
/* 分类菜单列表项鼠标悬停时子列表项链接的样式，设置颜色、宽度、文本溢出处理、背景色和内边距 */
#category li:hover ul li a{
color: rgba(255, 255, 255, 0.45);
width: 136px;
overflow: hidden;
background-color: rgb(34, 73, 160);
padding-left:0px;
}
/* 分类菜单子列表项链接鼠标悬停时的样式，设置内边距和左边距 */
#category li ul li:hover a{
padding-left:0px;
margin-left: 0px;
}
/* 分类菜单列表项鼠标悬停时链接的样式，设置颜色 */
#category li:hover a{
color:#fff
}
</style>
<body>
<div id="app">
<!-- 轮播图 -->
<div class="layui-carousel" id="swiper" :style='{"boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 auto","borderColor":"rgba(0,0,0,.3)","borderRadius":"0px","borderWidth":"0","width":"100%","borderStyle":"solid"}'>
<div carousel-item>
<div v-for="(item,index) in swiperList" :key="index">
<img style="width: 100%;height: 100%;object-fit:cover;" :src="item.img" />
</div>
<!-- Vue实例挂载的根元素 -->
<div id="app">
<!-- 轮播图容器，使用layui的轮播图组件 -->
<div class="layui-carousel" id="swiper" :style='{"boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 auto","borderColor":"rgba(0,0,0,.3)","borderRadius":"0px","borderWidth":"0","width":"100%","borderStyle":"solid"}'>
<div carousel-item>
<!-- 使用Vue的v-for指令循环渲染轮播图项，根据swiperList数组动态生成 -->
<div v-for="(item,index) in swiperList" :key="index">
<!-- 轮播图图片，设置宽度、高度和适应方式 -->
<img style="width: 100%;height: 100%;object-fit:cover;" :src="item.img" />
</div>
</div>
<!-- 轮播图 -->
<!-- 标题 -->
<!-- <h2 style="margin-top: 20px;" class="index-title">USER / CENTER</h2>
<div class="line-container">
<p class="line" style="background: #EEEEEE;"> 个人中心 </p>
</div> -->
<!-- 标题 -->
<div class="center-container">
<!-- 个人中心菜单 config.js-->
<div style=" width:auto; margin:-70px 10px 0px auto">
<div class="header" id="plheader">
<p class="title">个人中心</p>
<p class="subtitle">USER / CENTER</p>
</div>
<ul id="category">
<li v-for="(item,index) in centerMenu" v-bind:key="index" :class="index==0?'bbbb':''">
<a :href="'javascript:jump(\''+item.url+'\')'" style="color:#FFFFFF;" :class="index==0?'aaaa':''">{{item.name}}</a>
</li>
</ul>
</div> <!-- 个人中心菜单 -->
<!-- 个人中心 -->
<div class="right-container sub_borderColor" :style='{"padding":"20px","boxShadow":"0px rgba(255,0,0,.8)","margin":"0","backgroundColor":"#fff","borderRadius":"0","borderWidth":"1px","borderStyle":"solid"}'>
<form class="layui-form">
<!-- 主键 -->
<input type="hidden" v-model="detail.id" name="id" id="id" />
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生工号
</label>
<div class="layui-input-block input">
<input type="text" v-model="detail.yishengUuidNumber" name="yishengUuidNumber" id="yishengUuidNumber" lay-verify="required" placeholder="医生工号" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
账户
</label>
<div class="layui-input-block input">
<input type="text" v-model="detail.username" name="username" id="username" lay-verify="required" placeholder="账户" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生名称
</label>
<div class="layui-input-block input">
<input type="text" v-model="detail.yishengName" name="yishengName" id="yishengName" lay-verify="required" placeholder="医生名称" autocomplete="off" class="layui-input">
</div>
<!-- 标题部分，当前被注释掉，可根据需要显示 -->
<!-- <h2 style="margin-top: 20px;" class="index-title">USER / CENTER</h2>
<div class="line-container">
<p class="line" style="background: #EEEEEE;"> 个人中心 </p>
</div> -->
<!-- 个人中心容器，包含菜单和内容区域 -->
<div class="center-container">
<!-- 个人中心菜单区域，设置样式和位置 -->
<div style=" width:auto; margin:-70px 10px 0px auto">
<!-- 头部区域，显示标题和副标题 -->
<div class="header" id="plheader">
<p class="title">个人中心</p>
<p class="subtitle">USER / CENTER</p>
</div>
<!-- 分类菜单列表 -->
<ul id="category">
<!-- 使用Vue的v-for指令循环渲染菜单列表项，根据centerMenu数组动态生成 -->
<li v-for="(item,index) in centerMenu" v-bind:key="index" :class="index==0?'bbbb':''">
<!-- 菜单链接，点击调用jump函数并传递链接地址 -->
<a :href="'javascript:jump(\''+item.url+'\')'" style="color:#FFFFFF;" :class="index==0?'aaaa':''">{{item.name}}</a>
</li>
</ul>
</div>
<!-- 个人中心内容区域，右侧容器 -->
<div class="right-container sub_borderColor" :style='{"padding":"20px","boxShadow":"0px rgba(255,0,0,.8)","margin":"0","backgroundColor":"#fff","borderRadius":"0","borderWidth":"1px","borderStyle":"solid"}'>
<!-- 表单元素，使用layui表单 -->
<form class="layui-form">
<!-- 隐藏输入框，用于存储主键信息 -->
<input type="hidden" v-model="detail.id" name="id" id="id" />
<!-- 医生工号表单元素项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 表单标签，显示医生工号 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生工号
</label>
<!-- 输入框所在块 -->
<div class="layui-input-block input">
<!-- 医生工号输入框，使用v-model绑定数据，设置验证规则和占位符 -->
<input type="text" v-model="detail.yishengUuidNumber" name="yishengUuidNumber" id="yishengUuidNumber" lay-verify="required" placeholder="医生工号" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
科室
</label>
<div class="layui-input-block select">
<el-select v-model="detail.yishengTypes" filterable placeholder="请选择科室 Search111" style="border-color: var(--publicMainColor, #808080);" name="yishengTypes" id="yishengTypes">
<el-option
v-for="(item,index) in yishengTypesList"
v-bind:key="item.codeIndex"
:label="item.indexName"
:value="item.codeIndex">
</el-option>
</el-select>
</div>
</div>
<!-- 账户表单元素项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 表单标签，显示账户 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
账户
</label>
<!-- 输入框所在块 -->
<div class="layui-input-block input">
<!-- 账户输入框，使用v-model绑定数据，设置验证规则和占位符 -->
<input type="text" v-model="detail.username" name="username" id="username" lay-verify="required" placeholder="账户" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职位
</label>
<div class="layui-input-block select">
<el-select v-model="detail.zhiweiTypes" filterable placeholder="请选择职位 Search111" style="border-color: var(--publicMainColor, #808080);" name="zhiweiTypes" id="zhiweiTypes">
<el-option
v-for="(item,index) in zhiweiTypesList"
v-bind:key="item.codeIndex"
:label="item.indexName"
:value="item.codeIndex">
</el-option>
</el-select>
</div>
</div>
<!-- 医生名称表单元素项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 表单标签，显示医生名称 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
医生名称
</label>
<!-- 输入框所在块 -->
<div class="layui-input-block input">
<!-- 医生名称输入框，使用v-model绑定数据，设置验证规则和占位符 -->
<input type="text" v-model="detail.yishengName" name="yishengName" id="yishengName" lay-verify="required" placeholder="医生名称" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职称
</label>
<div class="layui-input-block input">
<input type="text" v-model="detail.yishengZhichneg" name="yishengZhichneg" id="yishengZhichneg" lay-verify="required" placeholder="职称" autocomplete="off" class="layui-input">
</div>
</div>
<!-- 科室表单元素项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 表单标签，显示科室 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
科室
</label>
<!-- 输入框所在块 -->
<div class="layui-input-block select">
<!-- Element UI的选择框，使用v-model绑定数据，设置过滤功能和占位符 -->
<el-select v-model="detail.yishengTypes" filterable placeholder="请选择科室 Search111" style="border-color: var(--publicMainColor, #808080);" name="yishengTypes" id="yishengTypes">
<!-- 使用Vue的v-for指令循环渲染选择项，根据yishengTypesList数组动态生成 -->
<el-option
v-for="(item,index) in yishengTypesList"
v-bind:key="item.codeIndex"
:label="item.indexName"
:value="item.codeIndex">
</el-option>
</el-select>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' style="opacity: 0;" class="layui-form-label">
医生头像
</label>
<div class="layui-input-block">
<img id="yishengPhotoImg" style="width: 100px;height: 100px;border-radius: 50%;border: 2px solid #EEEEEE;" :style='{"boxShadow":"0 0 3px rgba(160, 67, 26, 1)","borderColor":"rgba(135, 206, 250, 1)","backgroundColor":"#fff","borderRadius":"10px","borderWidth":"1px","width":"80px","borderStyle":"solid","height":"80px"}' :src="detail.yishengPhoto">
<input type="hidden" v-model="detail.yishengPhoto" id="yishengPhoto" name="yishengPhoto" />
</div>
</div>
<!-- 职位表单元素项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 表单标签，显示职位 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职位
</label>
<!-- 输入框所在块 -->
<div class="layui-input-block select">
<!-- Element UI的选择框，使用v-model绑定数据，设置过滤功能和占位符 -->
<el-select v-model="detail.zhiweiTypes" filterable placeholder="请选择职位 Search111" style="border-color: var(--publicMainColor, #808080);" name="zhiweiTypes" id="zhiweiTypes">
<!-- 使用Vue的v-for指令循环渲染选择项，根据zhiweiTypesList数组动态生成 -->
<el-option
v-for="(item,index) in zhiweiTypesList"
v-bind:key="item.codeIndex"
:label="item.indexName"
:value="item.codeIndex">
</el-option>
</el-select>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' style="opacity: 0;" class="layui-form-label">
医生头像
</label>
<div class="layui-input-block">
<button class="main_backgroundColor" :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"0 10px 0 0","borderColor":"#ccc","color":"#fff","borderRadius":"8px","borderWidth":"0","width":"auto","fontSize":"14px","borderStyle":"solid","height":"44px"}' type="button" class="layui-btn btn-theme"
id="yishengPhotoUpload">
<i v-if="true" :style='{"color":"#fff","show":true,"fontSize":"14px"}' class="layui-icon">&#xe67c;</i>上传医生头像
</button>
</div>
</div>
<!-- 职称表单元素项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 表单标签，显示职称 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
职称
</label>
<!-- 输入框所在块 -->
<div class="layui-input-block input">
<!-- 职称输入框，使用v-model绑定数据，设置验证规则和占位符 -->
<input type="text" v-model="detail.yishengZhichneg" name="yishengZhichneg" id="yishengZhichneg" lay-verify="required" placeholder="职称" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
联系方式
</label>
<div class="layui-input-block input">
<input type="text" v-model="detail.yishengPhone" name="yishengPhone" id="yishengPhone" lay-verify="required|phone" placeholder="联系方式" autocomplete="off" class="layui-input">
</div>
</div>
<!-- 医生头像显示区域表单元素项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 表单标签，设置透明度为0隐藏 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' style="opacity: 0;" class="layui-form-label">
医生头像
</label>
<!-- 输入框所在块 -->
<div class="layui-input-block">
<!-- 医生头像图片显示区域，使用v-model绑定图片地址 -->
<img id="yishengPhotoImg" style="width: 100px;height: 100px;border-radius: 50%;border: 2px solid #EEEEEE;" :style='{"boxShadow":"0 0 3px rgba(160, 67, 26, 1)","borderColor":"rgba(135, 206, 250, 1)","backgroundColor":"#fff","borderRadius":"10px","borderWidth":"1px","width":"80px","borderStyle":"solid","height":"80px"}' :src="detail.yishengPhoto">
<!-- 隐藏输入框，用于存储医生头像图片地址 -->
<input type="hidden" v-model="detail.yishengPhoto" id="yishengPhoto" name="yishengPhoto" />
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
挂号须知
</label>
<div class="layui-input-block input">
<input type="text" v-model="detail.yishengGuahao" name="yishengGuahao" id="yishengGuahao" lay-verify="required" placeholder="挂号须知" autocomplete="off" class="layui-input">
</div>
</div>
<!-- 医生头像上传按钮表单元素项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 表单标签，设置透明度为0隐藏 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' style="opacity: 0;" class="layui-form-label">
医生头像
</label>
<!-- 输入框所在块 -->
<div class="layui-input-block">
<!-- 医生头像上传按钮，点击触发上传操作 -->
<button class="main_backgroundColor" :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"0 10px 0 0","borderColor":"#ccc","color":"#fff","borderRadius":"8px","borderWidth":"0","width":"auto","fontSize":"14px","borderStyle":"solid","height":"44px"}' type="button" class="layui-btn btn-theme"
id="yishengPhotoUpload">
<!-- 上传图标 -->
<i v-if="true" :style='{"color":"#fff","show":true,"fontSize":"14px"}' class="layui-icon">&#xe67c;</i>上传医生头像
</button>
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
邮箱
</label>
<div class="layui-input-block input">
<input type="text" v-model="detail.yishengEmail" name="yishengEmail" id="yishengEmail" lay-verify="required|email" placeholder="邮箱" autocomplete="off" class="layui-input">
</div>
</div>
<!-- 联系方式表单元素项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 表单标签，显示联系方式 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
联系方式
</label>
<!-- 输入框所在块 -->
<div class="layui-input-block input">
<!-- 联系方式输入框，使用v-model绑定数据，设置验证规则和占位符 -->
<input type="text" v-model="detail.yishengPhone" name="yishengPhone" id="yishengPhone" lay-verify="required|phone" placeholder="联系方式" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">挂号价格</label>
<div class="layui-input-inline input">
<input type="number" v-model="detail.yishengNewMoney" name="yishengNewMoney" id="yishengNewMoney" placeholder="挂号价格" autocomplete="off" class="layui-input" disabled="disabled">
</div>
<div class="layui-form-mid layui-word-aux">
<i class="layui-icon" style="font-size: 20px;color: red;">&#xe65e;</i>
<a id="btn-recharge" href="javascript:void(0)">点我充值</a>
</div>
</div>
<!-- 挂号须知表单元素项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 表单标签，显示挂号须知 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
挂号须知
</label>
<!-- 输入框所在块 -->
<div class="layui-input-block input">
<!-- 挂号须知输入框，使用v-model绑定数据，设置验证规则和占位符 -->
<input type="text" v-model="detail.yishengGuahao" name="yishengGuahao" id="yishengGuahao" lay-verify="required" placeholder="挂号须知" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-item">
<div class="layui-input-block" style="display: flex;flex-wrap:wrap;">
<button class="main_backgroundColor" :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"10px auto 0","borderColor":"#ccc","color":"#fff","borderRadius":"8px","borderWidth":"0","width":"30%","fontSize":"15px","borderStyle":"solid","height":"44px"}' class="layui-btn btn-submit btn-theme" lay-submit lay-filter="*">更新信息</button>
<button :style='{"padding":"0 10px","boxShadow":"0 0 0px rgba(255,0,0,.5)","margin":"10px auto","borderColor":"#ccc","backgroundColor":"rgba(255, 0, 0, 1)","color":"rgba(255, 255, 255, 1)","borderRadius":"8px","borderWidth":"0","width":"30%","fontSize":"14px","borderStyle":"solid","height":"44px"}' @click="logout" class="layui-btn btn-submit">退出登录</button>
</div>
</div>
<!-- 邮箱表单元素项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 表单标签，显示邮箱 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">
邮箱
</label>
<!-- 输入框所在块 -->
<div class="layui-input-block input">
<!-- 邮箱输入框，使用v-model绑定数据，设置验证规则和占位符 -->
<input type="text" v-model="detail.yishengEmail" name="yishengEmail" id="yishengEmail" lay-verify="required|email" placeholder="邮箱" autocomplete="off" class="layui-input">
</div>
</form>
</div>
<!-- 个人中心 -->
</div>
</div>
<!-- layui -->
<script src="../../layui/layui.js"></script>
<!-- vue -->
<script src="../../js/vue.js"></script>
<!-- 引入element组件库 -->
<script src="../../xznstatic/js/element.min.js"></script>
<!-- 组件配置信息 -->
<script src="../../js/config.js"></script>
<!-- 扩展插件配置信息 -->
<script src="../../modules/config.js"></script>
<!-- 工具方法 -->
<script src="../../js/utils.js"></script>
<!-- 校验格式工具类 -->
<script src="../../js/validate.js"></script>
<script>
var vue = new Vue({
el: '#app',
data: {
// 轮播图
swiperList: [],
detail: {
yishengUuidNumber: new Date().getTime(),//数字
username: '',
password: '',
yishengName: '',
yishengTypes: '',//数字
yishengValue: '',//数字对应的值
zhiweiTypes: '',//数字
zhiweiValue: '',//数字对应的值
yishengZhichneg: '',
yishengPhoto: '',
yishengPhone: '',
yishengGuahao: '',
yishengEmail: '',
yishengNewMoney: '',
yishengContent: '',
createTime: '',
},
yishengTypesList: [],
zhiweiTypesList: [],
centerMenu: centerMenu
},
updated: function() {
// layui.form.render(null, 'myForm');
},
methods: {
jump(url) {
jump(url)
},
logout(){
localStorage.removeItem('Token');
localStorage.removeItem('role');
localStorage.removeItem('sessionTable');
localStorage.removeItem('adminName');
localStorage.removeItem('userid');
localStorage.removeItem('userTable');
localStorage.removeItem('iframeUrl');
window.parent.location.href = '../login/login.html';
}
}
})
layui.use(['layer', 'element', 'carousel', 'http', 'jquery', 'laydate', 'form', 'upload'], function() {
var layer = layui.layer;
var element = layui.element;
var carousel = layui.carousel;
var http = layui.http;
var jquery = layui.jquery;
var form = layui.form;
var upload = layui.upload;
// 充值
jquery('#btn-recharge').click(function(e) {
layer.open({
type: 2,
title: '用户充值',
area: ['900px', '600px'],
content: '../recharge/recharge.html'
});
});
// 获取轮播图 数据
http.request('config/list', 'get', {
page: 1,
limit: 5
}, function(res) {
if (res.data.list.length > 0) {
let swiperList = [];
res.data.list.forEach(element => {
if (element.value != null) {
swiperList.push({
img: element.value
});
}
});
vue.swiperList = swiperList;
// 轮播图
vue.$nextTick(() => {
carousel.render({
elem: '#swiper',
width: '100%',
height: '450px',
arrow: 'hover',
anim: 'default',
autoplay: 'true',
interval: '3000',
indicator: 'inside'
});
})
}
});
// 查询字典表相关
// 科室的查询和初始化
yishengTypesSelect();
// 职位的查询和初始化
zhiweiTypesSelect();
// 日期效验规则及格式
dateTimePick();
// 表单效验规则
form.verify({
// 正整数效验规则
integer: [
/^[1-9][0-9]*$/
,'必须是正整数'
]
// 小数效验规则
,double: [
/^[0-9]{0,6}(\.[0-9]{1,2})?$/
,'最大整数位为6为,小数最大两位'
]
});
// 上传 文件/图片
// 医生头像的文件上传
var yishengPhotoUpload = upload.render({
//绑定元素
elem: '#yishengPhotoUpload',
//上传接口
url: http.baseurl + 'file/upload',
// 请求头
headers: {
Token: localStorage.getItem('Token')
},
// 允许上传时校验的文件类型
accept: 'images',
before: function() {
//loading层
var index = layer.load(1, {
shade: [0.1, '#fff'] //0.1透明度的白色背景
});
},
// 上传成功
done: function(res) {
console.log(res);
layer.closeAll();
if (res.code == 0) {
layer.msg("上传成功", {
time: 2000,
icon: 6
})
var url = http.baseurl + 'upload/' + res.file;
vue.detail.yishengPhoto = url;
} else {
layer.msg(res.msg, {
time: 2000,
icon: 5
})
}
},
//请求异常回调
error: function() {
layer.closeAll();
layer.msg("请求接口异常", {
time: 2000,
icon: 5
})
}
});
// 查询用户信息
let table = localStorage.getItem("userTable");
if(!table){
layer.msg('请先登录', {
time: 2000,
icon: 5
}, function() {
window.parent.location.href = '../login/login.html';
});
}
http.request(`yisheng/session`, 'get', {}, function(data) {
// 表单赋值
// form.val("myForm", data.data);
vue.detail = data.data
// 图片赋值
//jquery("#yishengPhotoImg").attr("src", data.data.yishengPhoto);
});
// 提交表单
form.on('submit(*)', function(data) {
data = vue.detail;
data['createTime']=jquery("#createTime").val();
http.requestJson(table + '/update', 'post', data, function(res) {
layer.msg('修改成功', {
time: 2000,
icon: 6
}, function() {
window.location.reload();
});
});
return false
});
});
// 日期框初始化
function dateTimePick(){
}
//科室的查询
function yishengTypesSelect() {
//填充下拉框选项
layui.http.request("dictionary/page?page=1&limit=100&sort=&order=&dicCode=yisheng_types", "GET", {}, (res) => {
if(res.code == 0){
vue.yishengTypesList = res.data.list;
}
});
}
//职位的查询
function zhiweiTypesSelect() {
//填充下拉框选项
layui.http.request("dictionary/page?page=1&limit=100&sort=&order=&dicCode=zhiwei_types", "GET", {}, (res) => {
if(res.code == 0){
vue.zhiweiTypesList = res.data.list;
}
});
}
</script>
</body>
</html>
</div>
<!-- 挂号价格表单元素项 -->
<div class="layui-form-item main_borderColor" :style='{"padding":"10px","boxShadow":"0 0 0px rgba(255,0,0,.8)","margin":"0 0 10px 0","backgroundColor":"#fff","borderRadius":"1px","borderWidth":"0 0 1px 0","borderStyle":"solid"}'>
<!-- 表单标签，显示挂号价格 -->
<label :style='{"width":"110px","padding":"0 12px 0 0","fontSize":"15px","color":"#333","textAlign":"left"}' class="layui-form-label">挂号价格</label>
<!-- 输入框所在块 -->
<div class="layui-input-inline input">
<!-- 挂号价格输入框，使用v-model绑定数据，设置占位符，禁用输入 -->
<input type="number
Write Preview
Loading…
Cancel
Save