Skip to content

C
confucius
Commit 32cd7717 authored by 黄奎's avatar 黄奎
Browse files
Options

新增页面

parent 937c05e7
Show whitespace changes
Inline Side-by-side
Showing with 342 additions and 0 deletions
src/pages/scheduling/schedulingRecord.vue 0 → 100644
View file @ 32cd7717
<template>
<div class="page-body">
<div class="page-search row items-center">
<div class="col row wrap q-mr-lg q-col-gutter-md">
<div class="col-3">
<q-select @input="resetSearch" clearable multiple standout="bg-primary text-white" option-value="SId"
option-label="SName" v-model="msg.School_Ids" :options="schoolOptions" emit-value map-options label="校区"
@clear="resetSearch" />
</div>
<div class="col-3">
<div class="col-3 Sysuser_Date">
<q-field filled>
 <template v-slot:control>
<el-date-picker v-model="msg.StartDate" type="date" placeholder="开始日期" size="small" style="width:47%;"
@change="resetSearch" clear-icon="iconfont icon-guanbi">
</el-date-picker>至
<el-date-picker v-model="msg.EndDate" type="date" placeholder="结束日期" size="small" style="width:47%;"
@change="resetSearch" clear-icon="iconfont icon-guanbi">
</el-date-picker>
</template>
</q-field>
</div>
</div>
<div class="col-3">
<q-select v-model="msg.EmployeeIds" :options="EmployeeList" filled multiple clearable use-input label="值班人员"
option-label="EmployeeName" option-value="Id" ref="EmployeeName" class="col-6 q-pr-lg q-pb-lg" emit-value
map-options @input="resetSearch" @filter="filterFn">
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
未找到相关数据
</q-item-section>
</q-item>
</template>
</q-select>
</div>
</div>
</div>
<div class="page-content">
<q-table :pagination="msg" :loading="loading" no-data-label="暂无相关数据" flat class="sticky-column-table"
separator="none" title="排班计划" :data="dataList" :columns="columns" row-key="name">
<template v-slot:top="props">
<div class="col-2 q-table__title">排班计划</div>
<q-space />
<div class="page-option">
<q-btn color="accent" size="sm" icon="add" label="新增排班计划" @click="EditSchedu(null)" />
</div>
</template>
<template v-slot:body="props">
<q-tr :props="props">
<template v-for="col in props.cols">
<q-td v-if="col.name=='PlanDate'">
{{col.value}}
</q-td>
<q-td v-if="col.name=='SchoolName'">
{{col.value}}
</q-td>
<q-td v-if="col.name == 'PlanDetails'" style="padding-right:0px">
<div v-for="item in col.value">
<div class="border-bottom" style="padding-left: 16px;padding-right: 16px">
{{item.ShiftName}}
</div>
</div>
</q-td>
<q-td v-if="col.name == 'StartTime'" style="padding-right:0px">
<div v-for="item in col.value">
<div class="border-bottom" style="padding-left: 16px;padding-right: 16px">
{{item.StartTime}} - {{item.EndTime}}
</div>
</div>
</q-td>
<q-td v-if="col.name == 'DutyManName'" style="padding-right:0px">
<div v-for="item in col.value">
<div class="border-bottom" style="padding-left: 16px;padding-right: 16px">
{{item.DutyManName}}
</div>
</div>
</q-td>
<q-td v-if="col.name == 'DutyStatus'" style="padding-right:0px">
<span v-if="props.row.DutyStatus==0" style="color:blue">{{props.row.DutyStatusStr}}</span>
<span v-if="props.row.DutyStatus==1" style="color:green">{{props.row.DutyStatusStr}}</span>
<span v-if="props.row.DutyStatus==2" style="color:red">{{props.row.DutyStatusStr}}</span>
</q-td>
<q-td v-else-if="col.name == 'Id'" style="width:200px;">
<q-btn flat size="xs" icon="iconfont icon-View" style="font-weight:400;" class="q-mr-xs"  label="查看"
 @click=""   />
</q-td>
</template>
</q-tr>
</template>
<template v-slot:bottom>
<q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="pageCount"
:input="true" @input="changePage" />
</template>
</q-table>
<schedul-form v-if="isShowSchedu" :save-obj="scheduOption" @close="closeScheduForm" @success="refreshPage">
</schedul-form>
</div>
</div>
</template>
<script>
import {
GetDutyPlanPage,
RemoveDutyPlan
} from '../../api/scheduling/schedu'
import {
getSchoolDropdown
} from '../../api/school/index'; //获取校区列表
import schedulForm from '../../components/schedul/schedul-form'
import {
queryEmployee
} from '../../api/users/user'; //获取员工
export default {
meta: {
title: "排班计划"
},
components: {
schedulForm
},
data() {
return {
columns: [{
name: 'PlanDate',
label: '日期',
align: 'left',
field: 'PlanDate',
},
{
name: 'SchoolName',
label: '校区',
field: 'SchoolName',
align: 'left'
},
{
name: 'PlanDetails',
label: '班次',
align: 'left',
field: 'ShiftName',
field: row => row.PlanDetails
},
{
name: 'StartTime',
label: '值班时间',
align: 'left',
field: 'StartTime',
field: row => row.PlanDetails
},
{
name: 'DutyManName',
label: '值班人员',
align: 'left',
field: 'DutyManName',
field: row => row.PlanDetails
},
{
name: 'DutyStatus',
label: '状态',
align: 'left',
field: 'DutyStatus',
field: row => row.PlanDetails
},
{
name: 'Id',
label: '操作',
field: 'Id'
}
],
dataList: [],
loading: false,
msg: {
pageIndex: 1,
pageSize: 12,
rowsPerPage: 12,
School_Ids: [],
StartDate: "", //开始日期
EndDate: "", //结束日期
EmployeeIds: [], //员工列表
},
isShowSchedu: false,
scheduOption: null,
pageCount: 0,
schoolOptions: [], //校区列表
EmployeeList: [], //员工列表
AllemployeeList: [], //所有员工列表
}
},
created() {
let nowDay = new Date();
var year = nowDay.getFullYear(); //年
var month = nowDay.getMonth() + 1; //月
var day = nowDay.getDate(); //日
var currentDay = year + '-' + month + '-' + day;
this.msg.StartDate = currentDay;
this.querySchoolList();
this.getEmployee();
},
mounted() {
this.getList();
},
methods: {
//筛选员工
filterFn(val, update) {
update(() => {
if (val === '') {
this.EmployeeList = JSON.parse(JSON.stringify(this.AllemployeeList))
} else {
const needle = val.toLowerCase();
this.EmployeeList = this.AllemployeeList.filter(v => v.EmployeeName.toLowerCase().indexOf(needle) > -1);
}
})
},
//获取业务员
getEmployee() {
var qMsg = {
Dept_Id: 0
}
queryEmployee(qMsg).then(res => {
if (res.Code == 1) {
this.EmployeeList = res.Data;
this.AllemployeeList = res.Data;
}
}).catch(() => {})
},
//重新查询
resetSearch() {
this.msg.pageIndex = 1;
this.getList();
},
//获取校区列表
querySchoolList() {
getSchoolDropdown({}).then(res => {
if (res.Code == 1) {
this.schoolOptions = res.Data;
}
})
},
//获取校区列表
getList() {
GetDutyPlanPage(this.msg).then(res => {
if (res.Code == 1) {
this.dataList = res.Data.PageData;
this.pageCount = res.Data.PageCount;
}
})
},
//删除排班计划
RemovePlan(Id) {
this.$q.dialog({
title: "确定删除排班计划",
message: '',
cancel: {
label: "取消",
flat: true
},
ok: {
label: "确认",
flat: true,
focus: true
}
}).onOk(() => {
let msg = {
Id: Id
}
RemoveDutyPlan(msg).then(res => {
if (res.Code == 1) {
this.$q.notify({
icon: 'iconfont icon-chenggong',
color: 'accent',
timeout: 2000,
message: '操作成功',
position: 'top'
})
this.getList();
}
})
});
},
//分页改变
changePage(val) {
this.msg.pageIndex = val;
this.getList();
},
//新增修改值班计划
EditSchedu(obj) {
if (obj) {
this.scheduOption = obj;
} else {
this.scheduOption = null;
}
this.isShowSchedu = true;
},
//关闭新增修改弹窗
closeScheduForm() {
this.isShowSchedu = false;
},
//刷新页面
refreshPage() {
if (!this.scheduOption) {
this.msg.pageIndex = 1;
}
this.getList()
},
getStatus(props, obj) {
// let beginDateStr = props + ' ' + obj.StartTime;
// let endDateStr = props + ' ' + obj.EndTime;
// let str = 0;
// let curDate = new Date();
// let beginDate = new Date(beginDateStr);
// let endDate = new Date(endDateStr);
// if (curDate < beginDate) {
// str = 1 //未开始
// }
// if (curDate >= beginDate && curDate <= endDate) {
// str = 2 //进行中
// }
// if (curDate > endDate) {
// str = 3 //已结束
// }
// return str;
}
},
}
</script>
<style scoped>
.border-bottom {
border-bottom: 1px dashed #EEE;
padding-bottom: 5px;
margin-bottom: 5px;
}
</style>
<style lang="sass">
@import url('~assets/css/table.sass')
</style>
src/router/routes.js
View file @ 32cd7717
......@@ -677,6 +677,11 @@ const routes = [{
component: () =>
import("pages/scheduling/schedulingPlan.vue")
},
{
path: "/scheduling/schedulingRecord", //值班记录
component: () =>
import("pages/scheduling/schedulingRecord.vue")
},
{
path: "/scheduling/schedulDetail", //我的工作计划排班详情
component: () =>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment