master
xy 3 years ago
parent 06d456e2dc
commit bee07ab22d

@ -185,6 +185,7 @@ export default {
}, },
render(h) { render(h) {
let { let {
expandRowKeys,
size, size,
createPage, createPage,
summaryMethod, summaryMethod,
@ -229,6 +230,7 @@ export default {
cell-style={cellStyle} cell-style={cellStyle}
indent={indent} indent={indent}
data={list} data={list}
expand-row-keys={expandRowKeys}
height={height ?? tableHeight} height={height ?? tableHeight}
class="v-table" class="v-table"
style={tableStyle} style={tableStyle}

@ -214,12 +214,15 @@ export function deepCopy(data) {
return data; return data;
} }
} }
export function debounce(fn,delay=500){ export function debounce(fn, delay = 500) {
let timer = null let time = null;//time用来控制事件的触发
return function _debounce() { return function () {
if (timer) clearTimeout(timer) if (time !== null) {
timer = setTimeout(() => { clearTimeout(time);
fn() }
time = setTimeout(() => {
fn.call(this);
//利用call(),让this的指针从指向window 转成指向input
}, delay) }, delay)
} }
} }

@ -15,7 +15,7 @@
v-model="select.nurse_name" v-model="select.nurse_name"
placeholder="选择护工姓名" placeholder="选择护工姓名"
clearable clearable
style="width: 200px;margin-right: 10px;" style="width: 160px;margin-right: 10px;"
> >
<el-option <el-option
v-for="item in nurses" v-for="item in nurses"
@ -24,12 +24,29 @@
:key="item.id" :key="item.id"
></el-option> ></el-option>
</el-select> </el-select>
<el-select
filterable
size="small"
v-model="select.customer_name"
placeholder="选择被护理人"
clearable
style="width: 160px;margin-right: 10px;"
>
<el-option
v-for="item in customers"
:value="item.name"
:label="item.name"
:key="item.id"
></el-option>
</el-select>
<el-date-picker v-model="pickedMonth" placeholder="选择月份" type="month" size="small" style="width: 160px;margin-right: 10px;" @change="pickMonth">
</el-date-picker>
<el-select <el-select
size="small" size="small"
v-model="select.status" v-model="select.status"
placeholder="选择状态" placeholder="选择状态"
clearable clearable
style="width: 200px;margin-right: 10px;" style="width: 160px;margin-right: 10px;"
> >
<el-option <el-option
v-for="item in [{value:0,label:'待护理'},{value:1,label:'护理中'},{value:2,label:'已护理'}]" v-for="item in [{value:0,label:'待护理'},{value:1,label:'护理中'},{value:2,label:'已护理'}]"
@ -41,7 +58,7 @@
<Input <Input
v-model="select.keyword" v-model="select.keyword"
placeholder="关键字搜索" placeholder="关键字搜索"
style="width: 200px; margin-right: 10px" style="width: 180px; margin-right: 10px"
/> />
<Button <Button
style="margin-right: 10px" style="margin-right: 10px"
@ -51,26 +68,6 @@
> >
<xy-selectors @search="(select.page = 1), getList()" @reset="reset"> <xy-selectors @search="(select.page = 1), getList()" @reset="reset">
<template> <template>
<div class="select-item">
<div class="select-item__label">客户姓名</div>
<el-select
filterable
size="small"
v-model="select.customer_name"
placeholder="选择客户姓名"
clearable
style="width: 200px"
>
<el-option
v-for="item in customers"
:value="item.name"
:label="item.name"
:key="item.id"
></el-option>
</el-select>
</div>
<div class="select-item"> <div class="select-item">
<div class="select-item__label">地址</div> <div class="select-item__label">地址</div>
<el-input size="small" v-model="select.address_name" placeholder="请输入地址" style="width: 200px;"></el-input> <el-input size="small" v-model="select.address_name" placeholder="请输入地址" style="width: 200px;"></el-input>
@ -213,6 +210,7 @@ export default {
}, },
data() { data() {
return { return {
pickedMonth:"",
selectedRow:{}, selectedRow:{},
customers:[], customers:[],
nurses:[], nurses:[],
@ -234,17 +232,20 @@ export default {
{ {
type:'index', type:'index',
label:'序号', label:'序号',
width:56 width:54,
fixed:'left'
}, },
{ {
prop:'customer.name', prop:'customer.name',
label:'被护理人', label:'被护理人',
width:120 width:118,
fixed:'left'
}, },
{ {
prop:'nurse.name', prop:'nurse.name',
label:'护理人', label:'护理人',
width:120 width:118,
fixed:'left'
}, },
{ {
prop:'status_text', prop:'status_text',
@ -394,6 +395,11 @@ export default {
}; };
}, },
methods: { methods: {
pickMonth(e){
this.select.start_start_time = this.$moment(e).startOf('month').format('YYYY-MM-DD HH:mm:ss')
this.select.end_start_time = this.$moment(e).endOf('month').format('YYYY-MM-DD HH:mm:ss')
},
destroy(row){ destroy(row){
scheduleDelete({id:row.id}).then(res => { scheduleDelete({id:row.id}).then(res => {
this.$message({ this.$message({

@ -1,48 +1,52 @@
<template> <template>
<div> <div>
<div ref="lxHeader"> <div ref="lxHeader">
<lx-header icon="md-apps" style="margin-bottom: 10px; border: 0px; margin-top: 15px" text="护工排班视图"> <lx-header
icon="md-apps"
style="margin-bottom: 10px; border: 0px; margin-top: 15px"
text="护工排班视图"
>
<div slot="content"></div> <div slot="content"></div>
<slot> <slot>
<div style="display: flex"> <div style="display: flex">
<!-- <Input v-model="select.keyword" placeholder="关键字搜索" style="width: 200px; margin-right: 10px"/>--> <!-- <Input v-model="select.keyword" placeholder="关键字搜索" style="width: 200px; margin-right: 10px"/>-->
<!-- <Button style="margin-right: 10px" type="primary" @click="select.page = 1,getCustomerList()">查询</Button>--> <!-- <Button style="margin-right: 10px" type="primary" @click="select.page = 1,getCustomerList()">查询</Button>-->
<!-- <xy-selectors @search="select.page = 1,getList()" @reset="reset">--> <!-- <xy-selectors @search="select.page = 1,getList()" @reset="reset">-->
<!-- <template>--> <!-- <template>-->
<!-- <div class="select-item">--> <!-- <div class="select-item">-->
<!-- <div class="select-item__label">业务板块</div>--> <!-- <div class="select-item__label">业务板块</div>-->
<!-- <el-select size="small" v-model="select.product_type_id" placeholder="选择业务板块" clearable style="width: 200px">--> <!-- <el-select size="small" v-model="select.product_type_id" placeholder="选择业务板块" clearable style="width: 200px">-->
<!-- <el-option v-for="item in types" :value="item.id" :label="item.name" :key="item.id"></el-option>--> <!-- <el-option v-for="item in types" :value="item.id" :label="item.name" :key="item.id"></el-option>-->
<!-- </el-select>--> <!-- </el-select>-->
<!-- </div>--> <!-- </div>-->
<!-- <div class="select-item">--> <!-- <div class="select-item">-->
<!-- <div class="select-item__label">所属区域</div>--> <!-- <div class="select-item__label">所属区域</div>-->
<!-- <el-select size="small" v-model="select.area_id" placeholder="选择区域" clearable style="width: 200px">--> <!-- <el-select size="small" v-model="select.area_id" placeholder="选择区域" clearable style="width: 200px">-->
<!-- <el-option v-for="item in areas" :value="item.id" :label="item.value" :key="item.id"></el-option>--> <!-- <el-option v-for="item in areas" :value="item.id" :label="item.value" :key="item.id"></el-option>-->
<!-- </el-select>--> <!-- </el-select>-->
<!-- </div>--> <!-- </div>-->
<!-- <div class="select-item">--> <!-- <div class="select-item">-->
<!-- <div class="select-item__label">所属月份</div>--> <!-- <div class="select-item__label">所属月份</div>-->
<!-- <el-date-picker--> <!-- <el-date-picker-->
<!-- size="small"--> <!-- size="small"-->
<!-- v-model="select.month"--> <!-- v-model="select.month"-->
<!-- type="month"--> <!-- type="month"-->
<!-- value-format="yyyy-MM"--> <!-- value-format="yyyy-MM"-->
<!-- placeholder="选择月"--> <!-- placeholder="选择月"-->
<!-- style="width: 200px">--> <!-- style="width: 200px">-->
<!-- </el-date-picker>--> <!-- </el-date-picker>-->
<!-- </div>--> <!-- </div>-->
<!-- <div class="select-item">--> <!-- <div class="select-item">-->
<!-- <div class="select-item__label">状态</div>--> <!-- <div class="select-item__label">状态</div>-->
<!-- <el-radio v-model="select.schedule_status" :label="1"></el-radio>--> <!-- <el-radio v-model="select.schedule_status" :label="1"></el-radio>-->
<!-- <el-radio v-model="select.schedule_status" :label="2"></el-radio>--> <!-- <el-radio v-model="select.schedule_status" :label="2"></el-radio>-->
<!-- <el-radio v-model="select.schedule_status" label=""></el-radio>--> <!-- <el-radio v-model="select.schedule_status" label=""></el-radio>-->
<!-- </div>--> <!-- </div>-->
<!-- </template>--> <!-- </template>-->
<!-- </xy-selectors>--> <!-- </xy-selectors>-->
</div> </div>
</slot> </slot>
</lx-header> </lx-header>
@ -53,254 +57,447 @@
:list="list" :list="list"
:table-item="table" :table-item="table"
:total="total" :total="total"
@pageIndexChange="e => {select.page = e;getList()}" @pageIndexChange="
@pageSizeChange="e => {select.page = 1;select.page_size = e;getList()}"> (e) => {
select.page = e;
getList();
}
"
@pageSizeChange="
(e) => {
select.page = 1;
select.page_size = e;
getList();
}
"
>
<<template v-slot:btns> <<template v-slot:btns>
<el-table-column :width="80" align="center" label="操作" fixed="right" header-align="center"> <el-table-column
<template v-slot:default="scope"> :width="80"
<Button size="small" type="primary" ghost @click="show(scope.row)"></Button> align="center"
</template> label="操作"
</el-table-column> fixed="right"
</template> header-align="center"
>
<template v-slot:default="scope">
<Button size="small" type="primary" ghost @click="show(scope.row)"
>查看</Button
>
</template>
</el-table-column>
</template>
</xy-table> </xy-table>
<el-drawer <el-drawer
size="46%" size="46%"
title="护工排班" title="护工排班"
:visible.sync="isShowDrawer" :visible.sync="isShowDrawer"
direction="rtl"> direction="rtl"
>
<div class="draw-title">护工信息</div> <div class="draw-title">护工信息</div>
<div style="margin-left: 2%;"> <div style="margin-left: 2%">
<div style="margin-bottom: 8px;"> <div style="margin-bottom: 8px">
<span class="info-title">姓名</span> <span class="info-title">姓名</span>
<span class="info-content">{{ worker.name }}</span> <span class="info-content">{{ worker.name }}</span>
</div> </div>
<div style="margin-bottom: 8px;"> <div style="margin-bottom: 8px">
<span class="info-title">性别</span> <span class="info-title">性别</span>
<span class="info-content">{{ worker.sex }}</span> <span class="info-content">{{ worker.sex }}</span>
</div> </div>
<div style="margin-bottom: 8px;"> <div style="margin-bottom: 8px">
<span class="info-title">手机号</span> <span class="info-title">手机号</span>
<span class="info-content">{{ worker.mobile }}</span> <span class="info-content">{{ worker.mobile }}</span>
</div> </div>
<div style="margin-bottom: 8px;"> <div style="margin-bottom: 8px">
<span class="info-title">年龄</span> <span class="info-title">年龄</span>
<span class="info-content">{{ $moment().diff(worker.birthday,'year') }}</span> <span class="info-content">{{
$moment().diff(worker.birthday, "year")
}}</span>
</div> </div>
</div> </div>
<xy-table :height="400" style="margin-top: 20px;" :list="schedules" :table-item="scheduleTable" :is-page="false"> <el-date-picker
<template v-slot:btns> v-model="pickedMonth"
<el-table-column :width="130" align="center" label="操作" header-align="center"> type="month"
<template v-slot:default="scope"> size="small"
<el-popover placeholder="选择月份"
placement="right" style="width: 180px; margin-left: 10px; margin-top: 8px"
width="300" @change="
trigger="click"> (e) => {
<el-table :data="skus" :height="300"> this.scheduleSelect.start_date = $moment(e)
<el-table-column width="120" property="sku_info.name" label="明细名称"></el-table-column> .startOf('month')
<el-table-column width="100" property="time" label="时长(分)"></el-table-column> .format('YYYY-MM-DD');
</el-table> this.scheduleSelect.end_date = $moment(e)
<Button size="small" type="primary" ghost slot="reference" style="margin-right: 4px" @click="showDialog(scope.row)"></Button> .endOf('month')
</el-popover> .format('YYYY-MM-DD');
getSchedules();
}
"
></el-date-picker>
<el-input
v-model="scheduleSelect.customer_name"
placeholder="客户姓名"
size="small"
style="width: 180px; margin-left: 6px; margin-top: 8px"
@input="debounce(getSchedules,2000)()"
></el-input>
<xy-table
:row-key="
(row) => {
return row.id;
}
"
:expand-row-keys="expandRowKeys"
:height="400"
style="margin-top: 20px"
:default-expand-all="false"
:list="schedules"
:table-item="scheduleTable"
:is-page="false"
@expand-change="
({ row, expanded }) => {
expandRowKeys = [];
logs = [];
expandRowKeys.push(row.id);
getScheduleLog(row.id);
}
"
>
<template v-slot:btns>
<el-table-column
:width="100"
align="center"
label="操作"
header-align="center"
>
<template v-slot:default="scope">
<!-- <el-popover placement="right" width="300" trigger="click">-->
<!-- <el-table :data="skus" :height="300">-->
<!-- <el-table-column-->
<!-- width="120"-->
<!-- property="sku_info.name"-->
<!-- label="明细名称"-->
<!-- ></el-table-column>-->
<!-- <el-table-column-->
<!-- width="100"-->
<!-- property="time"-->
<!-- label="时长(分)"-->
<!-- ></el-table-column>-->
<!-- </el-table>-->
<!-- <Button-->
<!-- size="small"-->
<!-- type="primary"-->
<!-- ghost-->
<!-- slot="reference"-->
<!-- style="margin-right: 4px"-->
<!-- @click="getScheduleLog(scope.row.id)"-->
<!-- >明细</Button-->
<!-- >-->
<!-- </el-popover>-->
<template v-if="scope.row.status === 0"> <template v-if="scope.row.status === 0">
<Poptip <Poptip
v-model="isShowSku" v-model="isShowSku"
transfer transfer
confirm confirm
title="确认要删除订单?" title="确认要删除订单?"
@on-ok="deleteSchedule(scope.row)"> @on-ok="deleteSchedule(scope.row)"
<Button size="small" type="primary" ghost>删除</Button> >
</Poptip> <Button size="small" type="primary" ghost>删除</Button>
</template> </Poptip>
</template> </template>
</el-table-column> </template>
</template> </el-table-column>
</template>
</xy-table> </xy-table>
</el-drawer> </el-drawer>
</div> </div>
</template> </template>
<script> <script>
import { nurseSchedule,scheduleIndex,scheduleDelete } from '@/api/schedule' import {
import { getList } from '@/api/serveDetail' nurseSchedule,
scheduleIndex,
scheduleDelete,
scheduleLog,
} from "@/api/schedule";
import { getList } from "@/api/serveDetail";
import { debounce } from "@/utils";
export default { export default {
data() { data() {
return { return {
worker:{}, expandRowKeys: [],
isShowDrawer:false, worker: {},
isShowSku:false, isShowDrawer: false,
skus:[], isShowSku: false,
skus: [],
select: { select: {
page: 1, page: 1,
page_size: 10, page_size: 10,
// keyword:'', // keyword:'',
//product_type_id:'', //product_type_id:'',
// area_id:'', // area_id:'',
//month:'', //month:'',
//schedule_status:'', //schedule_status:'',
}, },
customers:[], customers: [],
products:[], products: [],
levels:[], levels: [],
orders:[], orders: [],
accounts:[], accounts: [],
types:[], types: [],
areas:[], areas: [],
list:[], list: [],
total:0, total: 0,
table:[ table: [
{ {
prop:'name', prop: "name",
label:'护工姓名', label: "护工姓名",
width:140 width: 140,
}, },
{ {
prop:'mobile', prop: "mobile",
label:'护工手机号', label: "护工手机号",
width:160 width: 160,
}, },
{ {
prop:'birthday', prop: "birthday",
label:'护工年龄', label: "护工年龄",
formatter:(cell,data,value) => { formatter: (cell, data, value) => {
return value ? this.$moment().diff(value,'year') : value return value ? this.$moment().diff(value, "year") : value;
}, },
width:100 width: 100,
}, },
{ {
prop:'address', prop: "address",
label:'护工地址', label: "护工地址",
align:'left', align: "left",
minWidth:200 minWidth: 200,
}, },
{ {
prop:'has_arrange', prop: "has_arrange",
label:'待完成', label: "待完成",
width:120 width: 120,
}, },
{ {
prop:'has_end', prop: "has_end",
label:'已完成', label: "已完成",
width:120 width: 120,
} },
], ],
schedules:[], pickedMonth: "",
scheduleTable:[ scheduleSelect: {
nurse_name: "",
customer_name: "",
page_size: 999,
page: 1,
start_date: "",
end_date: "",
},
logs: [],
schedules: [],
scheduleTable: [
{ {
prop:'customer.name', label: "服务明细",
label:'客户名称', width: 78,
width:120 type: "expand",
expandFn: (row) => {
return (
<Table
data={this.logs}
columns={[
{
title: "类型",
key: "type",
width: 120,
render: (h, { row, column, index }) => {
let map = new Map([
[1, "签到"],
[2, "过程打卡"],
[3, "签退"],
[4, "更新定位"],
]);
return h("span", {}, map.get(row.type));
},
},
{
title: "地址",
key: "address",
minWidth: 200,
},
{
title: "时间",
key: "created_at",
width: 180,
},
{
title: "照片",
minWidth: 200,
render: (h, { row }) => {
return h(
"div",
{},
row.upload_list.map((item) => {
return h("el-image", {
props: {
previewSrcList: row.upload_list.map(
(item) => item.upload.url
),
url: item.upload.url,
fit: "contain",
},
style: {
width: "200px",
},
});
})
);
},
},
]}
></Table>
);
},
}, },
{ {
prop:'customer.phone', prop: "customer.name",
label:'客户手机号', label: "客户名称",
width:150 width: 120,
}, },
{ {
prop:'sign_in', prop: "customer.phone",
label:'签到时间', label: "客户手机号",
width: 170 width: 150,
}, },
{ {
prop:'sign_out', prop: "start_time",
label:'签退时间', label: "计划签到时间",
width: 170 width: 170,
}, },
{ {
prop:'status', prop: "end_time",
label:'状态', label: "计划签退时间",
width: 170,
},
{
prop: "sign_in",
label: "签到时间",
width: 170,
},
{
prop: "sign_out",
label: "签退时间",
width: 170,
},
{
label: "实际服务时间",
width: 160,
customFn: (row) => {
return (
<span>
{row.sign_in && row.sign_out
? this.$moment(row.sign_out).diff(row.sign_in, "minutes")
: 0}
</span>
);
},
},
{
prop: "status",
label: "状态",
width: 120, width: 120,
formatter:(row,data,value) => { formatter: (row, data, value) => {
let map = new Map([ let map = new Map([
[0,'待护理'], [0, "待护理"],
[1,'护理中'], [1, "护理中"],
[2,'已护理'] [2, "已护理"],
]) ]);
return map.get(value) return map.get(value);
} },
} },
] ],
} };
}, },
methods: { methods: {
async getList(){ debounce,
const res = await nurseSchedule(this.select) async getScheduleLog(id) {
this.list = res.data const res = await scheduleLog({ id });
this.total = res.total console.log(res);
this.logs = res;
}, },
reset(){ async getList() {
const res = await nurseSchedule(this.select);
this.list = res.data;
this.total = res.total;
}, },
reset() {},
editor(){ editor() {},
showDialog(row) {
},
showDialog(row){
getList({ getList({
customer_id:row.customer_id customer_id: row.customer_id,
}).then(res => { }).then((res) => {
this.skus = res.data.filter(item => { this.skus =
return row.id === item.id res.data.filter((item) => {
})[0]?.sku ?? [] return row.id === item.id;
this.isShowSku = true })[0]?.sku ?? [];
}) this.isShowSku = true;
});
}, },
deleteSchedule(row){ deleteSchedule(row) {
scheduleDelete({ scheduleDelete({
id:row.id id: row.id,
}).then(res => { }).then((res) => {
this.$message({ this.$message({
type:'success', type: "success",
message:'删除成功' message: "删除成功",
}) });
this.getList() this.getList();
}) });
},
show(e) {
this.scheduleSelect.nurse_name = e.name;
this.worker = e;
this.getSchedules();
},
getSchedules() {
scheduleIndex(this.scheduleSelect).then((res) => {
this.schedules = res;
this.isShowDrawer = true;
});
}, },
show(e){
this.worker = e
scheduleIndex({
nurse_name:e.name,
page_size:9999
}).then(res => {
this.schedules = res
this.isShowDrawer = true
})
}
}, },
computed: {}, computed: {},
mounted() { mounted() {
this.getList() this.getList();
} },
} };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.select-item{ .select-item {
display: flex; display: flex;
align-items: center; align-items: center;
&__label{ &__label {
width: 100px; width: 100px;
padding: 10px 10px; padding: 10px 10px;
} }
} }
.draw-title{ .draw-title {
letter-spacing: 2px; letter-spacing: 2px;
font-weight: 600; font-weight: 600;
position: relative; position: relative;
padding: 10px 8px 10px 30px; padding: 10px 8px 10px 30px;
&::after{ &::after {
content: ''; content: "";
width: 10px; width: 10px;
height: 10px; height: 10px;
border-radius: 100%; border-radius: 100%;
background: #B3241D; background: #b3241d;
transform: translateY(-50%); transform: translateY(-50%);
position: absolute; position: absolute;
@ -308,11 +505,10 @@ export default {
left: 10px; left: 10px;
} }
} }
.info-title{ .info-title {
font-weight: 600; font-weight: 600;
} }
.info-content{ .info-content {
padding-left: 10px; padding-left: 10px;
} }
</style> </style>

Loading…
Cancel
Save