提交 50deada7 编写于 作者: lyf's avatar lyf

修改ui、添加分页

上级 85aaacef
......@@ -10,7 +10,7 @@
</div>
</div>
</div>
<div class="data">
<!-- <div class="data">
<div>
<div class="totallist">暂无</div>
<div class="statelist">全部</div>
......@@ -27,7 +27,7 @@
<div class="totallist">暂无</div>
<div class="statelist">全部</div>
</div>
</div>
</div> -->
</div>
</template>
......@@ -79,13 +79,11 @@ export default {
<style lang="scss" scoped>
.consultationlist {
padding: 25px 40px 25px 40px;
width: 488px;
height: 164px;
padding: 25px;
width: 100%;
background: #ffffff;
border-radius: 18px;
margin-left: 14px;
margin-top: 20px;
.list {
display: flex;
justify-content: space-between;
......@@ -99,6 +97,7 @@ export default {
display: flex;
justify-content: space-evenly;
align-items: center;
cursor: pointer;
.handle {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
......
......@@ -40,8 +40,9 @@ export default {
});
state.socketClient.on("diagnose_push_event", (socket) => {
console.log('diagnose_push_event---', socket);
const {list, countRespList} = socket;
const {list,allSize,countRespList} = socket;
store.commit('updateCurrentDiagList', list);
store.commit('updateAllSize', allSize);
store.commit('updateCurrentCalList', countRespList);
});
state.socketClient.on("diagnose_call_push_event", (socket) => {
......
......@@ -3,6 +3,9 @@ export default {
updateCurrentDiagList(state, obj) {
state.currentDiagList = obj;
},
updateAllSize(state,allSize){
state.allSize = allSize;
},
// 改变原数据
changeRawCurrentCalList(state,obj){
// console.log("obj",obj)
......
......@@ -2,6 +2,7 @@
export default {
currentDiagList:[],
allSize:0,
currentCalList:{},
RawCurrentCalList:[],
currentChat: {},
......
......@@ -4,7 +4,7 @@
<div class="header">
<!-- 面包屑 -->
<el-breadcrumb separator="/">
<el-breadcrumb-item >首页</el-breadcrumb-item>
<el-breadcrumb-item>首页</el-breadcrumb-item>
<el-breadcrumb-item>我的工作台</el-breadcrumb-item>
</el-breadcrumb>
<el-row style="margin-top: 30px">
......@@ -21,70 +21,26 @@
>
</el-date-picker>
</el-col>
<el-col :span="12" style="margin-lfet: 10px">
<div style="margin-left: 10px">
<div class="total">3519</div>
<div class="state">全部</div>
</div>
</el-col>
</el-row>
</div>
</el-col>
<el-col :span="12">
<div>
<el-row type="flex" justify="space-between">
<el-col :span="8">
<div>
<div class="total">3519</div>
<div class="state">全部</div>
</div>
</el-col>
<el-col :span="8">
<div>
<div class="total aa">3519</div>
<div class="state">全部</div>
</div>
</el-col>
<el-col :span="8">
<div>
<div class="total">3519</div>
<div class="state">全部</div>
</div>
</el-col>
<el-col :span="8">
<div>
<div class="total">3519</div>
<div class="state">全部</div>
</div>
</el-col>
</el-row>
</div>
</el-col>
</el-row>
</div>
<!-- 问诊列表 -->
<div class="box">
<div class="row" v-for="(item, index ) in operatorslist" :key="index">
<consultationlist :workbenchAdminDate="workbenchAdminDate" :operatorsItem="item"></consultationlist>
<div class="consultation-container">
<div class="consultation-content">
<div
class="consultation-li"
v-for="(item, index) in operatorslist"
:key="index"
>
<consultationlist
:workbenchAdminDate="workbenchAdminDate"
:operatorsItem="item"
></consultationlist>
</div>
</div>
</div>
<!-- 底部 -->
<!-- <div class="footer">-->
<!-- &lt;!&ndash; 分页 &ndash;&gt;-->
<!-- <el-row type="flex" justify="end">-->
<!-- <el-pagination-->
<!-- background-->
<!-- @size-change="handleSizeChange"-->
<!-- @current-change="handleCurrentChange"-->
<!-- :current-page="currentPage"-->
<!-- :page-sizes="[100, 200, 300, 400]"-->
<!-- :page-size="100"-->
<!-- layout="total, sizes, prev, pager, next"-->
<!-- :total="400"-->
<!-- >-->
<!-- </el-pagination>-->
<!-- </el-row>-->
<!-- </div>-->
</div>
</template>
......@@ -95,7 +51,9 @@ export default {
consultationlist,
},
data() {
const d = localStorage.getItem('workbenchAdminDate') || new Date().format('yyyy-MM-dd');
const d =
localStorage.getItem("workbenchAdminDate") ||
new Date().format("yyyy-MM-dd");
return {
workbenchAdminDate: d,
operatorslist: [],
......@@ -104,27 +62,26 @@ export default {
created() {
this.init();
},
watch:{
},
watch: {},
methods: {
init () {
init() {
this.GET("/diagnose/match/list").then(({ code, data }) => {
if (code == "000000") {
this.operatorslist = data;
}
});
}
},
},
};
</script>
<style lang="scss" scoped>
.administrators {
height: calc(100% - 76px);
.header {
padding: 40px 32px 0 32px;
padding: 30px;
width: 100%;
height: 181px;
background: #ffffff;
.el-input__inner {
width: 173px;
......@@ -167,19 +124,23 @@ export default {
line-height: 20px;
margin: 0 auto;
}
.aa {
color: #449284;
}
.box {
display: flex;
width: 100%;
flex-flow: row wrap;
align-content: flex-start;
min-height: 600px;
max-height: 700px;
.consultation-container {
overflow-y: scroll;
.row {
flex: 0 0 50%;
height: calc(100% - 154px);
width: 100%;
padding: 20px;
.consultation-content {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
overflow: hidden;
.consultation-li {
min-width: 488px;
width: 49%;
margin-bottom: 20px;
}
}
}
.footer {
......
<template>
<div class="diagnosis-list-content">
<div class="select-content screenSet content-top">
<div class="workbench-container">
<div class="select-content">
<div class="title">我的工作台</div>
<!-- 时间 -->
<el-row type="flex" justify="center">
<div id="picker">
<div class="block">
<div class="search-box">
<div class="search-item">
<el-date-picker
@change="changeDatetime"
v-model="searchParam.dateTime"
type="date"
size="small"
clear-icon="el-input-icon"
:clearable="false"
>
</el-date-picker>
</div>
<div class="search-item">
<el-input
size="small"
class="input-item"
v-model="searchParam.checkvalue"
placeholder="输入问诊单号/医生姓名"
></el-input>
</div>
</el-row>
<div>
<el-button type="primary" size="small" @click="search()"
>搜索</el-button
>
</div>
</div>
<!-- tab栏 -->
<el-radio-group
@change="tabChange"
......@@ -34,17 +48,17 @@
<!-- <el-radio-button label="1">待处理({{currentCalList}})</el-radio-button>-->
</el-radio-group>
</div>
<div class="select-content screenSet">
<div class="forbox">
<div class="workbench-content">
<div class="workbench-li" >
<div
class="for"
class="workbench"
v-for="(item, index) in currentDiagList"
:key="'for' + index"
:key="index"
>
<inquiryList-component :item="item"></inquiryList-component>
</div>
</div>
<el-row type="flex" justify="end">
<div class="pagination-container">
<el-pagination
background
@size-change="handleSizeChange"
......@@ -53,11 +67,13 @@
:page-sizes="[6, 12, 18, 24]"
:page-size="searchParam.pageSize"
layout="prev, pager, next, sizes, jumper"
:total="totalRows"
:total="allSize"
>
</el-pagination>
</el-row>
</div>
</div>
</div>
</template>
......@@ -72,6 +88,7 @@ export default {
},
computed: {
...mapState({
allSize:'allSize',
currentDiagList: "currentDiagList",
currentCalList: "currentCalList",
soketQuest: "soketQuest",
......@@ -105,10 +122,11 @@ export default {
return {
tabPosition: "1",
showChat: true,
totalRows: 40,
totalRows: 0,
loading: false,
searchParam: {
dateTime: d,
checkvalue: "", // 模拟值后去
operateUserId: id,
returnStatus: 1,
pageSize: 1,
......@@ -157,8 +175,11 @@ export default {
const s = this.searchParam;
s.dateTime = val.format("yyyy-MM-dd");
this.searchParam = s;
},
search() {
this.inquirySearch("clear");
},
handleSizeChange(val) {
const s = this.searchParam;
s.pageSize = val;
......@@ -254,24 +275,25 @@ export default {
}
}
}
.forbox {
display: flex;
justify-content: space-between;
// justify-content: space-between;
.for {
max-width: 50%;
display: flex;
}
}
.diagnosis-list-content {
.workbench-container {
.select-content {
margin-bottom: 10px;
padding: 10px;
padding:0 20px;
background: #fff;
overflow: hidden !important;
&.content-top {
padding-bottom: 0;
.search-box {
display: flex;
justify-content: flex-start;
width: 250px;
margin: 20px 0;
.search-item{
margin-right: 20px;
.input-item{
width: 333px;
}
}
}
.title {
height: 50px;
display: flex;
......@@ -285,16 +307,31 @@ export default {
}
}
}
}
.el-row {
margin-bottom: 20px;
&:last-child {
margin-bottom: 0;
.workbench-content{
padding: 20px;
.workbench-li {
display: flex;
justify-content: space-between;
.workbench {
max-width: 50%;
display: flex;
}
}
.pagination-container{
background-color: #fff;
height: 71px;
background: #FFFFFF;
border-radius: 18px;
display: flex;
justify-content: flex-end;
align-items: center;
margin-top: 10px;
}
}
}
.el-col {
border-radius: 4px;
}
.bg-purple-dark {
background: #99a9bf;
}
......@@ -317,8 +354,8 @@ export default {
background-color: #f9fafc;
}
@media screen and (min-width: 1900px) {
.forbox {
.for {
.workbench-li {
.workbench {
width: 30%;
}
}
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册