就诊医疗系统

已于 2024-08-01 12:13:42 修改
阅读量149 收藏
点赞数 1
文章标签： vue.js elementui javascript
于 2024-07-31 00:39:50 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_62660070/article/details/140804682
版权

把数据渲染到侧边栏

先通过外层拿到唯一值index

<template v-for="(item,index) in props.menuData">
          <!-- 没有子菜单的获取数组 -->
          <el-menu-item 
          v-if="!item.children || item.children.length ==0"
          :index="`${props.index}-${item.meta.id}`" 
          :key="`${props.index}-${item.meta.id}`">
          <!-- 图标 -->
          <el-icon size="20">
            <!-- vue的动态组件语法 -->
             <!-- 结合数据动态渲染图标 -->
            <component :is="item.meta.icon"></component>
          </el-icon>
          <!-- 菜单内容 -->
          <span>{{ item.meta.name }}</span>
          </el-menu-item>

          <!-- 有子菜单的 -->
          <el-sub-menu v-else :index="`${props.index}-${item.meta.id}`">
            <template #title>
              <el-icon size="20">
                  <component :is="item.meta.icon"></component>
              </el-icon>
              <span>{{ item.meta.name }}</span>
            </template>
            <!-- 有子菜单下面需要渲染的 -->
             <!-- 递归 -->
              <tree-menu :index="`${props.index}-${item.meta.id}`"
              :menu-data="item.children" />
          </el-sub-menu>

        </template>

渲染之后的结果是：

点击路由跳转：

Main.vue

显示图标：

下载并注册：

npm install @element-plus/icons-vue

main.js:
// main.ts

// 如果您正在使用CDN引入，请删除下面一行。
import * as ElementPlusIconsVue from '@element-plus/icons-vue'

const app = createApp(App)
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}

下载vuex,作为状态管理：

#安装
npm install vuex@next --save

#menu.js
const state={
  isCollapse:false,
  selectMenu:[]
}
const mutations={
  collapsMenu(state){
    state.isCollapse=!state.isCollapse
  }
}
export default {state,mutations}

# store/index.js
const state={
  isCollapse:false,
  selectMenu:[]
}
const mutations={
  collapsMenu(state){
    state.isCollapse=!state.isCollapse
  }
}
export default {state,mutations}

#挂载到main.js
// 挂载vuex实例
import store from './store'
app.use(store)

控制菜单展开与收起功能：

通过elementPlus中的某个属性：:collapse="isCollapse"

效果：

点击菜单，添加到顶部：

#menu.js

#mutation:
 addMenu(state,payload){
    // 对数据进行去重
    if(state.selectMenu.findIndex(item=>item.path === payload.path) === -1){
      state.selectMenu.push(payload)
    }
  }

#在treeMenu.vue中调用这个方法
import {useStore} from'vuex'
const store=useStore()
// 点击侧边栏跳转
const handleClick=(item,active) =>{
  // console.log(item);
  store.commit('addMenu',item.meta)
  router.push(item.meta.path)
}

#在navHeader中显示
import { useStore } from 'vuex'
import {computed} from 'vue'
// 拿到store实例
const store=useStore()
// 通过computed拿到数据
const selectMenu=computed(()=>store.state.menu.selectMenu)

<div class="header-left">
      <el-icon class="icon" size="20" @click="store.commit('collapsMenu')"><Fold/></el-icon>
    <!-- 顶部标签 -->
      <ul class="flex-box">
      <li
      v-for="(item,index) in selectMenu"
      :key="item.path"
      class="tab flex-box">
      <el-icon class="icon" size="20"><component :is="item.icon"/></el-icon>
      {{ item.name }}
      <!-- 关闭按钮 -->
      <el-icon class="icon" size="20"><Close/></el-icon>
    </li>
    </ul>
    </div>

点击高亮：让url中的数据与点击选中对应起来

#navHeader.vue

import { useRoute } from 'vue-router'
// 当前路由对象
const route=useRoute()


ul class="flex-box">
      <li
      v-for="(item,index) in selectMenu"
      :key="item.path"
      :class="{selected : route.path === item.path}"
      class="tab flex-box">
      <el-icon size="12"><component :is="item.icon"/></el-icon>
      <!-- 点击跳转 -->
       <router-link class="text flex-box" to="{path: item.path}">
        {{ item.name }}
       </router-link>
      <!-- 关闭按钮 -->
      <el-icon size="12" class="close"><Close/></el-icon>
    </li>


 .close{
        visibility: hidden;
      }
      &.selected {
        a{
          color: #409eff;
        }
        i{
          color: #409eff;
        }
        background-color: #f5f5f5;
      }

tag的点击关闭功能：

普通的直接关闭，高亮的点击关闭之后，高亮后移

#navHeader.vue添加点击事件
<!-- 关闭按钮 -->
      <el-icon size="12" class="close" @click="closeTab(item,index)"><Close/></el-icon>



#方法
import { useRoute,useRouter } from 'vue-router'
// 当前路由对象
const router=useRouter()
// 拿到store实例
const store=useStore()
// 通过computed拿到数据
const selectMenu=computed(()=>store.state.menu.selectMenu)
// 点击关闭tag
const closeTab=(item,index)=>{
  store.commit('closeMenu',item)
  // 删除非当前页tag
  if(route.path !== item.path){
    return
  }
  const selectMenuData = selectMenu.value
  // 删除最后一项
  if(index === selectMenuData.length){
    // 如果tag只有一个元素
    if(!selectMenuData.length){
      router.push('/')
    }else{
      router.push({
        path:selectMenuData[index-1].path
      })
    }
  }else{//删除的是中间位置tag
    router.push({
      path:selectMenuData[index].path
    })
  }

}

#menu.js存储状态
  closeMenu(state,payload){
    // 找到点击数据的索引
    const index = state.selectMenu.findIndex(val=>val.name === payload.name)
    // 通过索引删除数组指定元素
    state.selectMenu.splice(index,1)
  }

效果图：

卡片中登录和注册的切换：

#login/index.vue
<div class="jump-link">
        <el-link type="primary" @click="handleChange">{{ formType ? '返回登录':'注册账号' }}</el-link>
      </div>

import { ref } from 'vue'

const imgUrl = new URL('../../../public/login-head.png', import.meta.url).href
const formType=ref(0) //切换表单（0：登录，1：注册）
const handleChange=()=>{
  formType.value=formType.value ? 0:1
}

注册/登录页面：

<script setup>
// import { UserFilled } from '@element-plus/icons-vue/dist/types';
import { ElMessage } from 'element-plus';
import { reactive, ref } from 'vue'

const imgUrl = new URL('../../../public/login-head.png', import.meta.url).href
const formType=ref(0) //切换表单（0：登录，1：注册）
const handleChange=()=>{
  formType.value=formType.value ? 0:1
}

// 表单数据
const loginForm = reactive({
  userName:'',
  passWord:'',
  validCode:''
})
// 发送短信
const countdown = reactive({
  validText:'获取验证码',
  time:60
})
let flag=false
// 倒计时技术
const countdownChange =()=>{
  // 如果已发送，不做处理
  if(flag) return 
  // 判断手机号是否正确
  const phoneReg=/^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{8}$/
  if(!loginForm.userName || !phoneReg.test(loginForm.userName)){
    return ElMessage({
      message:'请检查手机号受否正确',
      type:'warning'
    })
  }
  // 倒计时
  setInterval(()=>{
    if(countdown.time<1){
      countdown.time-=60
      countdown.validText='获取验证码'
      flag=true

    }else{
      countdown.time-=1
      countdown.validText=`剩余${countdown.time}s`
    }
  },1000)
}

// 账号校验
const validateUser =(rule, value, callback)=>{
      // 不能为空
      if(value === ''){
        callback(new Error('请输入账号'))
      }else{
        const phoneReg=/^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{8}$/
        phoneReg.test(value) ? callback():callback(new Error('手机格式合适不对'))
      }
}
// 密码校验
const validatePass = (rule, value, callback)=>{
  if(value === ''){
        callback(new Error('请输入密码'))
      }else{
        const passReg=/^[a-zA-Z0-9_-]{4,16}$/
        passReg.test(value) ? callback():callback(new Error('密码为4-16位字符'))
      }
}
// 表单校验
const rules=reactive({
  userName:[{validator: validateUser, trigger: 'blur' }],
  passWord:[{validator: validatePass, trigger: 'blur' }],
})

// 提交
const submitForm =()=>{

}

</script>
<template>
  <el-row class="login-container" justify="center" :align="'middle'">
    <el-card style="max-width: 480px">
      <template #header>
        <div class="card-header">
          <!-- 静态资源的引入 -->
          <img :src="imgUrl" alt="">
        </div>
      </template>
      <div class="jump-link">
        <el-link type="primary" @click="handleChange">{{ formType ? '返回登录':'注册账号' }}</el-link>
      </div>
      <!-- 表单 -->
       <el-form 
       :rules="rules"
       :model="loginForm" 
       style="max-width: 600px"
       class="demo-ruleForm">
        <el-form-item prop="userName">
          <el-input v-model="loginForm.userName" placeholder="手机号" :prefix-icon="UserFilled"></el-input>
        </el-form-item>
        <el-form-item prop="passWord">
          <el-input v-model="loginForm.passWord" type="password" placeholder="密码" :prefix-icon="Lock"></el-input>
        </el-form-item>
        <el-form-item prop="validCode" v-if="formType">
          <el-input v-model="loginForm.validCode" placeholder="验证码" :prefix-icon="Lock">
            <template #append>
            <span @click="countdownChange">{{ countdown.validText }}</span>
          </template>
          </el-input>
         
        </el-form-item>

        <!-- 登录按钮 -->
         <el-form-item>
          <el-button type="primary" :style="{width:'100%'}" @click="submitForm">
            {{ formType? '注册账号':'登录' }}
          </el-button>
         </el-form-item>


       </el-form>
    </el-card>
  </el-row>
</template>
<style lang="less" scoped>
:deep(.el-card__header) {
    padding: 0
  }
  .login-container {
    height: 100%;
    .card-header{
      background-color: #899fe1;
      img {
        width: 430px;
      }
    }
    .jump-link {
      text-align: right;
      margin-bottom: 10px;
    }
  }
</style>

表单校验：

倒计时效果的制作：

效果图：

对axios进行二次封装：

#request.js
// 对axios进行简单的二次封装
import axios from "axios"
import { ElMessage } from "element-plus"
const instance = axios.create({
  baseURL: 'https:/v3pz.itndedu.com/v3pz',
  timeout: 10000,
});

// 添加拦截器
// 添加请求拦截器
instance.interceptors.request.use(function (config) {
  // 在发送请求之前做些什么
  const token=localStorage.getItem('pz_token')
  // 不需要添加token的api
  const whiteUrl=['get/code','user/authentication','login']
  if(token && !whiteUrl.includes(config.url)){
    config.headers['x-token']=token
  }

  return config;
}, function (error) {
  // 对请求错误做些什么
  return Promise.reject(error);
});

// 添加响应拦截器
instance.interceptors.response.use(function (response) {
  // 对接口异常的数据，给用户提示
  if(response.data.code === -1){
    ElMessage.warning(response.data.message)
  }
  // 2xx 范围内的状态码都会触发该函数。
  // 对响应数据做点什么
  return response;
}, function (error) {
  // 超出 2xx 范围的状态码都会触发该函数。
  // 对响应错误做点什么
  return Promise.reject(error);
});

export default instance

#index.js
import request from '../utils/request'
// 发送验证码
export const getCode =(data) =>{
  return request.post('/get/code',data)
}

#login/index.vue
import { getCode } from '../../api/index'
const countdownChange =()=>{
  // 如果已发送，不做处理
  if(flag) return 
  // 判断手机号是否正确
  const phoneReg=/^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{8}$/
  if(!loginForm.userName || !phoneReg.test(loginForm.userName)){
    return ElMessage({
      message:'请检查手机号受否正确',
      type:'warning'
    })
  }
  // 倒计时
  setInterval(()=>{
    if(countdown.time<=0){
      countdown.time = 60
      countdown.validText='获取验证码'
      flag=false
    }else{
      countdown.time -= 1
      countdown.validText=`剩余${countdown.time}s`
    }
  },1000)

  flag = true
    // 获取验证码，与接口连桥
     getCode({tel:loginForm.userName}).then((data)=>{
          // console.log(data,'data')
          if(data.code === 10000){
            ElMessage.success('发送成功')
          }
     })
    
}

 注册接口，登录接口的联调：

#indx.js
// https:/v3pz.itndedu.com/v3pz/user/authentication
// 注册用户
export const userAuthentication =(data)=>{
  return request.post('/user/authentication',data)
}

// https:/v3pz.itndedu.com/v3pz/login
// 登录
export const login=(data)=>{
  return request.post('/login',data)
}

#/login/index.vue
const submitForm =async(formEl,fields)=>{
  if (!formEl) return
  // 手动触发校验
  await formEl.validate((valid) => {
    if (valid) {
      // console.log('submit!')
      // 注册页面
      if(formType.value){
        userAuthentication(loginForm).then(({date})=>{
          if(date.code === 10000){
            ElMessage.success('注册成功，请登录')
            formType.value=0
          }
        })
      }else{
        // 登录页面
        login(loginForm).then(({data})=>{
          if(data.code === 10000){
            ElMessage.success('登录成功')
            console.log(data)
            // 将token和用户信息缓存到浏览器
            localStorage.setItem('pz_token',data.data.token)
            localStorage.setItem('pz_userInfo',JSON.stringify(data.data.userInfo))
            // localStorage无法传引用数据类型，因此用stringify转成字符串
          }
        })

      }
    } else {
      console.log('error submit!',fields)
    }
  })
}

添加前置路由守卫，并且如果如果token过期，返回登录页：

亮点在于，在清除路由信息的时候，可以 通过： window.location.href=window.location.origin

#main.js
// 拦截器
router.beforeEach((to,from)=>{
    const token = localStorage.getItem('pz_token')
    // 非登录页面，token不存在
    if(!token && to.path !== '/login'){
      return '/login'
    }else if(token && to.path === '/login'){
      return '/'
    }else {
      return true
    }
})

#api/index.js
// 权限管理列表
// https:/v3pz.itndedu.com/v3pz/auth/admin
export const authAdmin = (params)=>{
  return request.get('/auth/admin',{params})
}

#admin/index.vue
<script setup>
import { authAdmin }from '../../../api/index'
import { reactive, onMounted } from 'vue'
const paginationData = reactive({
  pageNum: 1,
  pageSize: 10
}) 

onMounted(()=>{
  authAdmin(paginationData).then(({data})=>{
    console.log(data,'authAdmin')
  })
})
</script>
<template>
  <div>admin</div>
</template>
<style lang="less" scoped>

</style>

#request.js
// 添加响应拦截器
instance.interceptors.response.use(function (response) {
  // 对接口异常的数据，给用户提示
  if(response.data.code === -1){
    ElMessage.warning(response.data.message)
  }
  if(response.data.code === -2){
    localStorage.removeItem('pz_token')
    localStorage.removeItem('pz_userInfo')
    window.location.href=window.location.origin
  }
  // 2xx 范围内的状态码都会触发该函数。
  // 对响应数据做点什么
  return response;
}, function (error) {
  // 超出 2xx 范围的状态码都会触发该函数。
  // 对响应错误做点什么
  return Promise.reject(error);
});

菜单添加管理弹窗：

#group/index.vue
<template>
  <button @click="dialogFormVisable=true">打开</button>
  <!-- 弹窗 -->
  <el-dialog
  v-model="dialogFormVisable"
  :before-close="beforeClose"
  title="添加权限"
  width="500">
  <!-- form表单 -->
  <el-form
    ref="formRef"
    label-width="100px"
    label-position="left"
    :model="form"
    :rules="rules">
    <el-form-item label="名称" prop="name">
      <el-input v-model="form.name" placeholder="请填写权限名称"></el-input>
    </el-form-item>
    <el-form-item label="权限" prop="permissions">
      <el-tree
      ref="treeRef"
      style="max-width: 600px"
      :data="permissionData"
      node-key="id"
      show-checkbox
      :default-check-keys="defaultKeys"
      />
    </el-form-item>
  </el-form>
  <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="confirm()">
          确认
        </el-button>
      </div>
    </template>
  </el-dialog>


// 弹窗的显示与隐藏
const dialogFormVisable= ref(false)

// 关闭弹窗的回调
const beforeClose=()=>{
  dialogFormVisable.value=false
}
// form表单数据
const form = reactive({
  id:'',
  name:'',
  permissions:''
})
// 树型菜单权限数据
const permissionData = ref([])
onMounted(()=>{
  // 菜单数据
  userGetmenu().then(({data})=>{
    // console.log(data)
    permissionData.value=data.data
  })
  getListData()
})


#index.js
// 数型菜单，权限管理
// https:/v3pz.itndedu.com/v3pz/user/getmenu
export const userGetmenu=()=>{
  return request.get('/user/getmenu')
}

弹窗默认情况下，权限管理及其子菜单，默认选中：

菜单管理的列表页：

#group.vue
<template>
  <button @click="open(null)">打开</button>
<!-- 表单数据 -->
<el-table :data="tabelData.list">
  <el-table-column prop="id" label="id"/>
  <el-table-column prop="name" label="昵称"/>
  <el-table-column prop="permissionName" label="菜单权限"/>
  <el-table-column label="操作">
    <template #default="scope">
          <el-button type="primary" @click="open(scope.row)">编辑</el-button>
    </template>
  </el-table-column>
</el-table>


// 请求列表数据
const getListData =() =>{
  menuList(paginationData).then(({data})=>{
    // console.log(data,'data')
    const{list,total}=data.data
    tabelData.list=list
    tabelData.total=total

  })
// 列表数据
const tabelData = reactive({
  list:[],
  total:0
})
// 打开编辑弹窗
const open = (rowData={})=>{
    dialogFormVisable.value=true
    // 弹窗打开form是异步的
    nextTick(()=>{
      if(rowData){
        Object.assign(form,{id:rowData.id,name:rowData.name})
        treeRef.value.setCheckedKeys(rowData.permission)
      }
    })
}
onMounted(()=>{
  // 菜单数据
  userGetmenu().then(({data})=>{
    // console.log(data)
    permissionData.value=data.data
  })
  getListData()
})





#index.js
export const userSetmenu=(data)=>{
      return request.post('/user/setmenu',data)
}

// 菜单权限列表
export const menuList=(params) =>{
  return request.get('/menu/list',{params})
}

 表单重置： formRef.value.resetFields()

头部做成一个组件：

#paneHead.vue
<script setup>

</script>

<template>
  <div class="panel-heading">
  <div class="panel-lead">
    <div class="title">菜单管理</div>
    <p class="description">菜单规则通常对应一个控制器的方法</p>
  </div>
</div>
</template>



<style lang="less" scoped>
.panel-heading {
    padding: 15px;
    background: #e8edf0;
    border-color: #e8edf0;
    position: relative;
    .panel-lead {
      font-size: 14px;
      .title {
        font-weight: bold;
        font-style: normal;
      }
      .description {
        margin-top: 5px;
      }
    }
  }
</style>

#引入作为全局组件
// 引入头部组件
import PanelHead from './components/panelHead.vue'
app.component('PanelHead',PanelHead)

#group.vue调用
 <panel-head />
 <div class="btns">
  <el-button :icon="Plus" type="primary" @click="open(null)" size="small">新增</el-button>
 </div>

效果：

根据以下，写权限列表：

#admin.vue
<script setup>
import { authAdmin,menuSelectlist }from '../../../api/index'
import dayjs from 'dayjs'
import { ref, reactive, onMounted } from 'vue'
const paginationData = reactive({
  pageNum: 1,
  pageSize: 10
}) 

const tableData=reactive({
  list:[],
  total:0
})

onMounted(()=>{
  authAdmin(paginationData).then(({data})=>{
    console.log(data,'authAdmin')
    const { list,total} = data.data
    list.forEach(item =>{
      item.create_time=dayjs(item.create_time).format('YYYY-MM-DD')
    })
    tableData.list=list
    tableData.total=total
    
  })
  menuSelectlist().then(({data})=>{
    options.value=data.data

  })
})
const options=ref([])
// 根据权限id匹配权限名称
const permissionName = (id) =>{
  const data = options.value.find(el=>el.id === id)
  return data ? data.name : '超级管理员'
}

const open = ()=>{

}
</script>
<template>
  <div>admin</div>

  <el-table :data="tableData.list" style="width: 100%;">
  <el-table-column prop="id" label="id"/>
  <el-table-column prop="name" label="昵称"/>
  <el-table-column prop="permissionName" label="所属组别">
    <template #default="scope">
          {{ permissionName(scope.row.permissions_id)}}
    </template>
  </el-table-column>

  <el-table-column prop="mobile" label="手机号"/>

  <el-table-column prop="active" label="状态">
    <template #default="scope">
      <el-tag :type="scope.row.active ? 'success' : 'danger'">{{ scope.row.active? '正常':'失效' }}</el-tag>
    </template>
  </el-table-column>

  <el-table-column label="创建时间">
    <template #default="scope">
      <div class="flex-box">
        <el-icon><Clock/></el-icon>
      <span style="margin-left: 10px">{{ scope.row.create_time }}</span>
      </div>
      <!-- <el-tag :type="scope.row.active ? 'success' : 'danger'">{{ scope.row.active? '正常':'失效' }}</el-tag> -->
    </template>
  </el-table-column>

  <el-table-column label="操作">
    <template #default="scope">
          <el-button type="primary" @click="open(scope.row)">编辑</el-button>
    </template>
  </el-table-column>
</el-table>
</template>
<style lang="less" scoped>
.flex-box {
  display: flex;
  align-items: center;
}
</style>

#index.js
// 权限下拉列表
// menu/selectlist
export const menuSelectlist=()=>{
  return request.get('menu/selectlist')
}

 

顶瓜瓜的wa
关注
医疗业务系统介绍
liyonglin27的博客
03-07 3818
一、 医院业务系统 3 1.1. HIS（医院管理信息系统） 3 1.2. EMR（电子病历系统） 3 1.3. PACS/RIS系统 4 1.4. LIS系统 4 1.5. PEIS（体检管理系统） 5 1.6. 病案系统 5 1.7. 病理系统 5 1.8. HRP（医疗资源规划系统） 5 1.9. OA系统 5 1.10. 移动护理系统 5 1.11. 手术麻醉系统 6 1.12. 临床路径管理系统 6 1.13. 合理用药系统 6 1.14. 血液管理系统 6 1.15. CIS（临床医疗信息系统）
C#医疗挂号系统试题
张晨光老师的播客
02-29 1939
某医院要实现患者就诊信息的电子化管理，要求使用.NET WinForms技术完成一个患者就诊管理系统的开发，其中保存在SQL Server 2008数据库中的患者挂号信息如下： 数据库名 PatientsDB 表名 PatientsInfo 字段显示 字段名 ...
中联医疗系统服务器,中联电子病历系统(ZLEMR)
weixin_29712031的博客
08-09 2638
中联电子病历系统(简称ZLEMR)主要完成如下功能：● 实现各类门诊/住院病历文件书写规范、格式和书写审核要求的设置调整● 各种病历文件的全文示范、段落示范和词句示范的编辑管理● 病人就诊过程各种病历的书写、审签、归档管理与质量控制● 对病人病历的查阅、分析和利用系统特点规范性：● 完全遵循卫生部相关规范标准，包括《病历书写规范》、《电子病历系统功能规范(试行)》● 真正结构化病历，...
医院分诊管理系统
qq_38633310的博客
05-07 5766
医院分诊管理管理系统 随着信息科学技术的迅速发展，当今医学科学的研究对计算机技术的依赖性越来越强，医院的信息化建设已经迫在眉捷，而门诊部是医院的一个重要部门，也是病人就诊的第一个环节，是医院直接向社会广大患者提供医疗服务的窗口之一，门诊部的信息化建设直接关系到整个医院的信息化建设的发展水平。如今我国人民群众的生活水平不断的提高，人们对医疗健康服务质量的需求越来越高，加上现...
医院信息系统
Amberalpha的博客
07-11 666
医院信息系统 数字化医院概述
便捷高效的新智能医疗就诊系统研究.pdf
09-07
智能医疗就诊系统研究 在人口增长和二胎政策开放的背景下，医疗市场的竞争和发展日益激烈。为了提高医疗服务质量和效率，智能医疗就诊系统的研究和开发变得非常重要。该系统主要以产科为例，通过线上与线下的结合，...
毕业设计jspSSM智慧医疗系统医院挂号就诊系统源码含文档含教程
07-08
毕业设计jspSSM智慧医疗系统医院挂号就诊系统源码含文档含教程 后台是ssm框架，页面是jsp，数据库mysql，jdk1.8，开发工具用ecplise、myecplise、sts、idea都可以 本系统主要分为四大部分：患者功能模块，医生功能...
计算机毕业设计SSM智慧医疗系统医院挂号就诊系统论文
08-19
计算机毕业设计SSM智慧医疗系统医院挂号就诊系统论文
JAVA入门学习者练习项目-医疗就诊系统.zip
01-28
【标题】"JAVA入门学习者练习项目-医疗就诊系统.zip" 涉及的主要知识点是Java编程语言在实际项目开发中的应用，特别是针对初学者如何将理论知识转化为实践能力的训练。医疗就诊系统是一个常见的软件工程案例，它可以...
医疗就诊流程智能导航系统的设计.docx
12-17
医疗就诊流程智能导航系统的设计 医疗就诊流程智能导航系统是一种利用信息技术优化医院管理，提升患者诊疗体验，提高医疗服务效率的解决方案。该系统通过分析影响就医体验的因素，结合互联网技术与医疗服务流程理念...
vue使用自定义指令实现一键复制
Zing_ing的博客
09-09 607
/ 将需要复制的内容保存到元素上if (!console.log('无复制内容');return;// 创建一个 textarea 元素，用于选择和复制// 执行复制命令try {console.log('复制成功:', el.$value);console.log('复制失败');// 删除创建的 textarea 元素// 监听点击事件},// 当指令所在的元素被更新时触发},// 指令解绑时移除事件监听});
SprinBoot+Vue远程教育网站的设计与实现
赵广陆
09-10 1202
目录1 项目介绍2 项目截图3 核心代码3.1 Controller3.2 Service3.3 Dao3.4 application.yml3.5 SpringbootApplication3.5 Vue4 数据库表设计5 文档参考6 计算机毕设选题推荐7 源码获取 1 项目介绍 博主个人介绍：CSDN认证博客专家，CSDN平台Java领域优质创作者，全网30w+粉丝，超300w访问量，专注于大学生项目实战开发、讲解和答疑辅导，对于专业性数据证明一切！ 主要项目：javaweb、ssm、spring
Vue CLI：初学者指南与深入理解
x15514104477的博客
09-10 914
本文为初学者提供了一个关于如何使用 Vue CLI 的指南，并帮助读者深入理解其核心概念。Vue CLI 是一个用于快速搭建 Vue.js 项目的命令行工具，适用于所有水平的开发者。
Vue Router push方法的使用
最新发布
ithongchou的博客
09-13 410
是一个用于编程式导航的方法，它可以将用户导航到应用中的不同路由。它提供了灵活的路由控制能力，允许你在应用的逻辑中进行路由操作，例如在用户交互后进行页面跳转。
有关 Element-ui 的一些思考
小白小白从不日别的博客
09-11 454
这里列举了一些我们在使用element-ui时的一些实用技巧，比如主题样式修改、el-form-item label宽度自适应等
vue组件通信，点击传值，动态传值（父传子，子传父）
爱敲代码的卡拉米的博客
09-12 454
通过上面的例子，你应该对Vue中如何使用按钮来传递值（通过内部方法或组件间通信）有了基本的了解。记得Vue的数据绑定和组件通信机制是构建Vue应用的关键。
大文件切片上传-vue3.0
m0_56416159的博客
09-12 348
大文件切片上传（也称为分片上传）是一种处理大文件上传的有效方法，它通过将大文件分割成多个较小的部分（即切片或分片），然后分别上传这些切片到服务器，最后在服务器上将这些切片合并成原始文件。以下是关于大文件切片上传的详细步骤和注意事项。onUploadInit： 文件初始化调用接口，用于后端创建存放切片文件的文件夹。SparkMD5：生成文件唯一的hash，用来验证文件的完整性。onUploadFinish：文件上传完成验证完整性的接口。onUploadChunk：分片上传接口。基于vue3.0代码实现。
从`v-model`到显式绑定：掌控Vue组件中的数据流动20240910
Narutolxy的博客
09-10 554
v-model
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值