You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
244 lines
8.6 KiB
244 lines
8.6 KiB
1 month ago
|
<template>
|
||
|
|
<div class="min-width" style="background: #F5F7FA;">
|
||
|
|
<div class="doctor-list-wrap ">
|
||
|
|
<p class="pageTitle">医生列表</p>
|
||
|
|
<el-form>
|
||
|
|
<div class="selectAllTable-wrap flex-between">
|
||
|
|
<div class="left flex">
|
||
|
|
<div class="checkboxAll">
|
||
|
|
<el-checkbox @change="handleCheckAllChange"
|
||
|
|
v-model="checked">全选</el-checkbox>
|
||
|
|
</div>
|
||
|
|
<span class="totalCount">共{{ totalNum }}条，已选{{ selectNum }}条</span>
|
||
|
|
<GuipButton type="ignore" :btnstyle="{width:'99px',height:'32px',margin:'0 26px'}" @click="batchOperate('1')">批量禁用</GuipButton>
|
||
|
|
<GuipButton type="ignore" :btnstyle="{width:'99px',height:'32px'}" @click="batchOperate('2')">批量启用</GuipButton>
|
||
|
|
</div>
|
||
|
|
<div class="right flex mt32">
|
||
|
|
<span>搜索医生</span>
|
||
|
|
<GuipInput ref="GuipInput" style="margin:0 24px 0 12px" width="280px" height="32px" placeholder="输入姓名" />
|
||
|
|
<GuipButton @click="addDoctor" size="form">新增医生</GuipButton>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="tableList mt32">
|
||
|
|
<div class="top flex-between mb24">
|
||
|
|
<div class="left left1 flex">
|
||
|
|
<el-checkbox @change="handleCheckAllChange(1)"
|
||
|
|
v-model="checked1"></el-checkbox>
|
||
|
|
<el-avatar src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"></el-avatar>
|
||
|
|
<span class="name">张虎</span>
|
||
|
|
<span>13788990987</span>
|
||
|
|
<GuipSwitch :modelValue="switchValue" @change="onSwitchChange(1)">
|
||
|
|
</GuipSwitch>
|
||
|
|
<GuipButton type="text" @click="editDoctor(1)">编辑</GuipButton>
|
||
|
|
</div>
|
||
|
|
<div class="right">
|
||
|
|
<GuipButton type="system" size="form" @click="addHospital(1)">添加医院</GuipButton>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<GuipTable :multiple="true" :tableData="tableData" style="width: 100%" ref="table_1"
|
||
|
|
:show-header="false" :loading="loading">
|
||
|
|
<el-table-column fixed="left" prop="sort" label="排序" width="70"></el-table-column>
|
||
|
|
</GuipTable>
|
||
|
|
</div>
|
||
|
|
</el-form>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
const cityOptions = ['上海', '北京', '广州', '深圳'];
|
||
|
|
import store from '@/store';
|
||
|
|
import GuipTable from '@/components/GuipTable.vue';
|
||
|
|
// import SvgIcon from '@/components/SvgIcon.vue';
|
||
|
|
import GuipButton from '@/components/GuipButton.vue';
|
||
|
|
import GuipSwitch from '@/components/GuipSwitch.vue';
|
||
|
|
import GuipInput from '@/components/GuipInput.vue';
|
||
|
|
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
tableData: [
|
||
|
|
{
|
||
|
|
sort:1
|
||
|
|
}
|
||
|
|
],
|
||
|
|
loading:false,
|
||
|
|
switchValue:true,
|
||
|
|
checked:false,
|
||
|
|
checked1:false,
|
||
|
|
totalNum: 0,
|
||
|
|
selectNum: 0,
|
||
|
|
isIndeterminate:true,
|
||
|
|
doctorList:[
|
||
|
|
{
|
||
|
|
id:10,
|
||
|
|
name:'一二',
|
||
|
|
idcard:'532524198711223615',
|
||
|
|
desc:'就哈哈哈哈，嗷跳舞',
|
||
|
|
detail:'拉开是金德拉克撒娇了大数据连接拉萨。。。',
|
||
|
|
tag:'专业',
|
||
|
|
phone:'17785748373',
|
||
|
|
avatar:'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',
|
||
|
|
status:true,
|
||
|
|
list:[
|
||
|
|
{
|
||
|
|
hos:[
|
||
|
|
'第三人民医院 针灸科',
|
||
|
|
'第一人民医院 中医科',
|
||
|
|
],
|
||
|
|
time:'2054 - 10 - 03',
|
||
|
|
status:true,
|
||
|
|
group:'2组',
|
||
|
|
setMenu:'4套餐',
|
||
|
|
nums:'88项',
|
||
|
|
checked:false,
|
||
|
|
},
|
||
|
|
]
|
||
|
|
},
|
||
|
|
{
|
||
|
|
id:10,
|
||
|
|
name:'一二',
|
||
|
|
idcard:'532524198711223615',
|
||
|
|
desc:'就哈哈哈哈，嗷跳舞',
|
||
|
|
detail:'拉开是金德拉克撒娇了大数据连接拉萨。。。',
|
||
|
|
tag:'专业',
|
||
|
|
phone:'17785748373',
|
||
|
|
avatar:'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',
|
||
|
|
status:false,
|
||
|
|
list:[
|
||
|
|
{
|
||
|
|
hos:[
|
||
|
|
'第三人民医院 针灸科',
|
||
|
|
'第一人民医院 中医科',
|
||
|
|
],
|
||
|
|
time:'2054 - 10 - 03',
|
||
|
|
status:true,
|
||
|
|
group:'2组',
|
||
|
|
setMenu:'4套餐',
|
||
|
|
nums:'88项',
|
||
|
|
checked:false,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
hos:[
|
||
|
|
'第三人民医院 针灸科',
|
||
|
|
'第一人民医院 中医科',
|
||
|
|
],
|
||
|
|
time:'2054 - 10 - 03',
|
||
|
|
status:true,
|
||
|
|
group:'2组',
|
||
|
|
setMenu:'4套餐',
|
||
|
|
nums:'88项',
|
||
|
|
checked:false,
|
||
|
|
},
|
||
|
|
]
|
||
|
|
},
|
||
|
|
{
|
||
|
|
id:10,
|
||
|
|
name:'一二',
|
||
|
|
idcard:'532524198711223615',
|
||
|
|
desc:'就哈哈哈哈，嗷跳舞',
|
||
|
|
detail:'拉开是金德拉克撒娇了大数据连接拉萨。。。',
|
||
|
|
tag:'专业',
|
||
|
|
phone:'17785748373',
|
||
|
|
avatar:'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',
|
||
|
|
status:false,
|
||
|
|
list:[
|
||
|
|
{
|
||
|
|
hos:[
|
||
|
|
'第三人民医院 针灸科',
|
||
|
|
'第一人民医院 中医科',
|
||
|
|
],
|
||
|
|
time:'2054 - 10 - 03',
|
||
|
|
status:true,
|
||
|
|
group:'2组',
|
||
|
|
setMenu:'4套餐',
|
||
|
|
nums:'88项',
|
||
|
|
checked:false,
|
||
|
|
},
|
||
|
|
]
|
||
|
|
},
|
||
|
|
]
|
||
|
|
}
|
||
|
|
},
|
||
|
|
components: {
|
||
|
|
// GuipToolTip,
|
||
|
|
// SvgIcon,
|
||
|
|
GuipInput,
|
||
|
|
GuipButton,
|
||
|
|
GuipSwitch,
|
||
|
|
GuipTable,
|
||
|
|
// CustomDropdown
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
store.commit('SET_PAGENAME', '医生管理'); // 登录页面不显示侧边栏
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
handleCheckAllChange(val) {
|
||
|
|
this.checkedCities = val ? cityOptions : [];
|
||
|
|
this.isIndeterminate = false;
|
||
|
|
},
|
||
|
|
batchOperate(type){
|
||
|
|
if(type== '1'){
|
||
|
|
// 禁用
|
||
|
|
|
||
|
|
}else{
|
||
|
|
// 启用
|
||
|
|
|
||
|
|
}
|
||
|
|
},
|
||
|
|
onSwitchChange(index){
|
||
|
|
console.log(index,'====');
|
||
|
|
},
|
||
|
|
addDoctor(){
|
||
|
|
console.log('添加医生');
|
||
|
|
},
|
||
|
|
addHospital(index){
|
||
|
|
console.log(index,'====');
|
||
|
|
},
|
||
|
|
editDoctor(index){
|
||
|
|
console.log(index,'====');
|
||
|
|
},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
::v-deep .el-avatar{
|
||
|
|
width: 26px;
|
||
|
|
height: 26px;
|
||
|
|
}
|
||
|
|
.doctor-list-wrap {
|
||
|
|
margin: 12px;
|
||
|
|
background: #fff;
|
||
|
|
padding: 32px 36px;
|
||
|
|
height: 100%;
|
||
|
|
border-radius: 4px;
|
||
|
|
.left,.right{
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
.selectAllTable-wrap{
|
||
|
|
align-items: center;
|
||
|
|
.totalCount{
|
||
|
|
font-size: 12px;
|
||
|
|
font-weight: normal;
|
||
|
|
line-height: 13px;
|
||
|
|
letter-spacing: 0.08em;
|
||
|
|
color: #8A9099;
|
||
|
|
margin-left: 12px;
|
||
|
|
}
|
||
|
|
.right{
|
||
|
|
letter-spacing: 0.08em;
|
||
|
|
color: #626573;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.left1{
|
||
|
|
gap: 12px;
|
||
|
|
}
|
||
|
|
.el-form-item{
|
||
|
|
margin-bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
</style>
|