zq
1 month ago
8 changed files with 350 additions and 236 deletions
|
After Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 56 KiB After Width: | Height: | Size: 11 KiB |
@ -1,5 +1,244 @@ |
|||
<template> |
|||
<view> |
|||
kasjdkashdkjsahjk |
|||
</view> |
|||
<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> |
|||
Loading…
Reference in new issue