Merge branch 'new5_25home' of http://39.108.172.131:3000/Shannon_mu/SmartCommunity into new5_25home

operationSupport/src/views/patrolManagement/components/weekContent.vue

@@ -0,0 +1,230 @@
+<template >
+    <div class="scheduling-table-body">
+        <div class="weeb-body" v-for="(its, inx) in timeObjArr" :key="inx">
+            <template v-for="(item, index) in its">
+                <div
+                    class="task"
+                    :class="resultTime(keyValues(inx), item) ? 'disabled' : ''"
+                    v-if="intersectionDay(keyValues(inx), item, inx)"
+                    :key="index"
+                >
+                    <div class="task-content">
+                        <div class="task-content-title">{{ item.routeName }}</div>
+                        <div class="task-content-time">{{ item.times }}</div>
+                        <div class="task-set" v-if="matchingTime(keyValues(inx), item).isActive">
+                            <span @click="resultTime(keyValues(inx), item) ? null : addItem(keyValues(inx), item)">
+                                {{ matchingTime(keyValues(inx), item).partolName }}</span
+                            >
+                        </div>
+                        <div class="task-set" v-else-if="!resultTime(keyValues(inx), item)">
+                            <span @click="addItem(keyValues(inx), item)">设置</span>
+                        </div>
+                    </div>
+                </div>
+            </template>
+        </div>
+    </div>
+</template>
+<script>
+export default {
+    props: {
+        timeObj: {
+            type: Object,
+            default: () => {
+                return {
+                    monday: '',
+                    tuesday: '',
+                    wednesday: '',
+                    thursday: '',
+                    friday: '',
+                    saturday: '',
+                    sunday: ''
+                };
+            }
+        },
+        timeObjArr: {
+            type: Array,
+            default: () => {
+                return [[], [], [], [], [], [], []];
+            }
+        },
+        calendarData: {
+            type: Array,
+            default: () => []
+        },
+        findUser: {
+            type: Array,
+            default: () => []
+        }
+    },
+    data() {
+        return {};
+    },
+    methods: {
+        addItem(itemTime, item) {
+            new Promise((resolve) => {
+                this.$store.dispatch('addPopup', {
+                    url: '/patrolManagement/popups/weekEditAdd.vue',
+                    width: '450px',
+                    height: '300px',
+                    props: {
+                        callback: resolve,
+                        findUser: this.findUser,
+                        dateDe: itemTime,
+                        item: item
+                    },
+                    title: '排班'
+                });
+            }).then(() => {
+                this.$emit('getList', {
+                    startTime: `${this.timeObj.monday} 00:00:00`,
+                    endTime: `${this.timeObj.sunday} 23:59:59`
+                });
+            });
+        },
+        //对比 现在时间 选择的时间至灰处理
+        resultTime(tis, item) {
+            let thisTime = this.$moment().format('YYYY-MM-DD') + ' 00:00:00';
+            let itemTime = this.$moment(tis + ' 00:00:00').format('YYYY-MM-DD HH:mm:ss');
+            return this.$moment(thisTime).valueOf() > this.$moment(itemTime).valueOf();
+        },
+        intersectionDay(tis, item, index) {
+            let startDate = this.$moment(item.startDate).format('YYYY-MM-DD HH:mm:ss');
+            let endDate = this.$moment(item.endDate).format('YYYY-MM-DD HH:mm:ss');
+            let thisDate = this.$moment(tis + ' 00:00:00').format('YYYY-MM-DD HH:mm:ss');
+            let vra = item.periodValue.split(',').sort();
+            //每周几
+            if (item.periodType == 1) {
+                return (
+                    this.$moment(startDate).valueOf() <= this.$moment(thisDate).valueOf() &&
+                    this.$moment(thisDate).valueOf() <= this.$moment(endDate).valueOf() &&
+                    vra.includes(vra[index])
+                );
+                //每隔几天
+            } else if (item.periodType == 2) {
+                let oneDay = 86400000;
+                // 第一天重合
+                if (this.$moment(thisDate).valueOf() - this.$moment(startDate).valueOf() == 0 || item.periodValue == 0) {
+                    return true;
+                } else {
+                    return (
+                        this.$moment(startDate).valueOf() <= this.$moment(thisDate).valueOf() &&
+                        this.$moment(thisDate).valueOf() <= this.$moment(endDate).valueOf() &&
+                        ((this.$moment(thisDate).valueOf() - this.$moment(startDate).valueOf()) / oneDay) %
+                            (Number(item.periodValue) + 1) ==
+                            0
+                    );
+                }
+            }
+        },
+        // 对比已设置内容
+        matchingTime(tis, item) {
+            let objs = {
+                isActive: false
+            };
+            this.calendarData.map((items) => {
+                if (tis == items.partrolDate) {
+                    items.rosterUserDtos.map((isv) => {
+                        if (isv.id == item.id && isv.partrolTime == item.times) {
+                            objs.isActive = true;
+                            Object.assign(objs, isv);
+                        }
+                    });
+                }
+            });
+            return objs;
+        },
+        keyValues(index) {
+            if (index == 0) {
+                return this.timeObj.monday;
+            } else if (index == 1) {
+                return this.timeObj.tuesday;
+            } else if (index == 2) {
+                return this.timeObj.wednesday;
+            } else if (index == 3) {
+                return this.timeObj.thursday;
+            } else if (index == 4) {
+                return this.timeObj.friday;
+            } else if (index == 5) {
+                return this.timeObj.saturday;
+            } else if (index == 6) {
+                return this.timeObj.sunday;
+            }
+        }
+    }
+};
+</script>
+<style lang="scss" scoped>
+.scheduling-table {
+    text-align: center;
+    height: calc(100% - 100px);
+    width: 100%;
+    padding: 20px;
+    background: #ffffff;
+    border-radius: 4px;
+    &-body {
+        height: calc(100% - 45px);
+        display: grid;
+        grid-template-columns: 2fr 2fr 2fr 2fr 2fr 2fr 2fr;
+        .weeb-body {
+            overflow-y: auto;
+            overflow-x: hidden;
+            &::-webkit-scrollbar {
+                z-index: 11;
+                display: none;
+            }
+            &::-webkit-scrollbar-track,
+            &::-webkit-scrollbar-corner {
+                background: transparent;
+            }
+            &::-webkit-scrollbar-thumb {
+                border-radius: 5px;
+                display: none;
+                background: rgba(250, 250, 250, 0.09);
+            }
+            &::-webkit-scrollbar-track-piece {
+                background: transparent;
+                display: none;
+            }
+            .task {
+                height: 20%;
+                min-height: 120px;
+                border: 1px solid #e0e1e3;
+                color: #424656;
+                border-top: none;
+
+                &-content {
+                    &-title {
+                        font-size: 20px;
+                        font-weight: 600;
+                        padding-top: 20px;
+                    }
+                    &-time {
+                        font-size: 16px;
+                        line-height: 35px;
+                    }
+                    .task-set {
+                        font-size: 12px;
+                        color: #0eaeff;
+                        span {
+                            cursor: pointer;
+                        }
+                    }
+                }
+                &.disabled {
+                    opacity: 0.5;
+                    .task-set {
+                        color: #424656;
+                        span {
+                            cursor: inherit;
+                        }
+                    }
+                }
+            }
+            &:first-of-type {
+                border: none;
+            }
+        }
+    }
+}
+</style>

operationSupport/src/views/patrolManagement/patrolRoute.vue

@@ -9,6 +9,9 @@
                 <el-button type="primary" class="search-btn" @click="mixins_search" icon="el-icon-search">查询</el-button>
 
                 <div class="search-icon">
+                    <el-tooltip class="item" effect="light" placement="bottom" content="排班">
+                        <i class="zoniot_font zoniot-icon-piliangshenhe" @click="weekEdit()"></i>
+                    </el-tooltip>
                     <el-tooltip class="item" effect="light" placement="bottom" content="新增">
                         <i class="zoniot_font zoniot-icon-tianjia2" @click="add()"></i>
                     </el-tooltip>
@@ -23,7 +26,7 @@
                 @page-change="pageChange"
             >
                 <template slot-scope="scope" slot="startDate">
-                    {{ checkDateType(scope.row.startDate)}}{{ '至' + checkDateType(scope.row.endDate) }}</template
+                    {{ checkDateType(scope.row.startDate) }}{{ '至' + checkDateType(scope.row.endDate) }}</template
                 >
                 <template slot-scope="scope" slot="periodValue">{{
                     scope.row.periodType == 1 ? `每周${periodValueType(scope.row.periodValue)}` : `每隔${scope.row.periodValue}天`
@@ -42,6 +45,7 @@
         </template>
         <scheduling v-if="isLook === 'schedu'" @initPage="initPage"></scheduling>
         <add-patrol v-if="isLook === 'patrol'" @initPage="initPage"></add-patrol>
+        <week-edit-page v-if="isLook === 'weekEd'" @initPage="initPage"></week-edit-page>
     </div>
 </template>
 
@@ -49,12 +53,14 @@
 import list from '@utils/list.js';
 import scheduling from './popups/scheduling.vue';
 import addPatrol from './popups/addPatrol.vue';
+import weekEditPage from './popups/weekEdit.vue';
 export default {
     mixins: [list],
     name: 'patrolManagement',
     components: {
         scheduling,
-        addPatrol
+        addPatrol,
+        weekEditPage
     },
     data() {
         let _this = this;
@@ -142,6 +148,9 @@ export default {
             this.thisObj = row;
             this.isLook = 'schedu';
         },
+        weekEdit() {
+            this.isLook = 'weekEd';
+        },
         initPage() {
             this.isLook = 'index';
             this.thisObj = {};
@@ -160,4 +169,7 @@ export default {
 };
 </script>
 <style scoped lang='scss'>
+.main{
+    height: 100%;
+}
 </style>

operationSupport/src/views/patrolManagement/popups/weekEdit.vue

@@ -0,0 +1,181 @@
+<template>
+    <div class="scheduling">
+        <div class="search">
+            <el-date-picker
+                v-model="monthValue"
+                value-format="yyyy-MM-dd"
+                format="yyyy 年 第 WW 周"
+                :picker-options="{ firstDayOfWeek: 1 }"
+                type="week"
+                placeholder="选择周"
+                :clearable="false"
+                @change="weekChange"
+            ></el-date-picker>
+            <div class="search-icon">
+                <el-tooltip effect="light" placement="bottom" content="返回">
+                    <i class="zoniot_font zoniot-icon-fanhui" @click="goback()"></i>
+                </el-tooltip>
+            </div>
+        </div>
+        <div class="scheduling-table">
+            <div class="scheduling-table-head">
+                <div class="head-week">周一 {{ $moment(timeObj.monday).format('M/DD') }}</div>
+                <div class="head-week">周二 {{ $moment(timeObj.tuesday).format('M/DD') }}</div>
+                <div class="head-week">周三 {{ $moment(timeObj.wednesday).format('M/DD') }}</div>
+                <div class="head-week">周四 {{ $moment(timeObj.thursday).format('M/DD') }}</div>
+                <div class="head-week">周五 {{ $moment(timeObj.friday).format('M/DD') }}</div>
+                <div class="head-week">周六 {{ $moment(timeObj.saturday).format('M/DD') }}</div>
+                <div class="head-week">周日 {{ $moment(timeObj.sunday).format('M/DD') }}</div>
+            </div>
+            <week-content :timeObj="timeObj" :timeObjArr="timeObjArr" :calendarData="calendarData" :findUser="findUser" @getList="getShiftInformation"></week-content>
+        </div>
+    </div>
+</template>
+<script>
+import weekContent from '../components/weekContent.vue';
+export default {
+    components: {
+        weekContent
+    },
+    data() {
+        return {
+            monthValue: '',
+            findUser: [],
+            calendarData: [],
+            timeObj: {
+                monday: '',
+                tuesday: '',
+                wednesday: '',
+                thursday: '',
+                friday: '',
+                saturday: '',
+                sunday: ''
+            },
+            timeObjArr: [[], [], [], [], [], [], []]
+        };
+    },
+    filters: {
+        dateNewType(val) {
+            return val.getDate();
+        }
+    },
+    watch: {
+        monthValue(e) {
+            this.timeObj.monday = this.$moment(e).day(1).format('YYYY-MM-DD');
+            this.timeObj.tuesday = this.$moment(e).day(2).format('YYYY-MM-DD');
+            this.timeObj.wednesday = this.$moment(e).day(3).format('YYYY-MM-DD');
+            this.timeObj.thursday = this.$moment(e).day(4).format('YYYY-MM-DD');
+            this.timeObj.friday = this.$moment(e).day(5).format('YYYY-MM-DD');
+            this.timeObj.saturday = this.$moment(e).day(6).format('YYYY-MM-DD');
+            this.timeObj.sunday = this.$moment(e).day(7).format('YYYY-MM-DD');
+
+            this.getTaskList({
+                startDate: `${this.timeObj.monday}`,
+                endDate: `${this.timeObj.sunday}`
+            });
+            this.getShiftInformation({
+                startTime: `${this.timeObj.monday} 00:00:00`,
+                endTime: `${this.timeObj.sunday} 23:59:59`
+            });
+        }
+    },
+    methods: {
+        goback() {
+            this.$emit('initPage');
+        },
+        // 获取 已排版
+        getShiftInformation(obj) {
+            this.$http.post('/sc-community/patrolRoute/getShiftInformation', obj).then(({ data, status, msg }) => {
+                if (!!data) {
+                    let calendarData = [];
+                    for (let inx in data) {
+                        let rosterUserDtos = [];
+                        data[inx].map((item) => {
+                            rosterUserDtos.push({
+                                partrolTime: item.patrolTime,
+                                partolName: item.partolName,
+                                id: item.id,
+                                patrolUserId: item.patrolUserId
+                            });
+                        });
+                        calendarData.push({
+                            partrolDate: this.$moment(inx).format('YYYY-MM-DD'),
+                            rosterUserDtos: rosterUserDtos
+                        });
+                    }
+                    this.calendarData = calendarData;
+                    this.$forceUpdate();
+                }
+            });
+        },
+        // 获取周任务
+        getTaskList(obj) {
+            this.timeObjArr = [[], [], [], [], [], [], []];
+            this.$http.post('/sc-community/patrolRoute/list', obj).then(({ data, status, msg }) => {
+                if (!!data) {
+                    data.map((item, index) => {
+                        this.pushTimeRout(item);
+                    });
+                }
+                this.$forceUpdate();
+            });
+        },
+        // 路线分配
+        pushTimeRout(data) {
+            let thisDay = data.periodValue.split(',').sort();
+            let timePeriod = data.timePeriod.split(',');
+
+            //每周
+            if (data.periodType == 1) {
+                timePeriod.map((items) => {
+                    thisDay.map((item, index) => {
+                        this.timeObjArr[item - 1].push(Object.assign({ times: items }, data));
+                    });
+                });
+            }
+            //每隔几天
+            else if (data.periodType == 2) {
+                timePeriod.map((items) => {
+                    this.timeObjArr.map((item, index) => {
+                        item.push(Object.assign({ times: items }, data));
+                    });
+                });
+            }
+        }
+    },
+    created() {
+        this.monthValue = this.$moment().startOf('weeks').format('YYYY-MM-DD');
+    },
+    mounted() {
+        this.findUser = this.$parent.findUser;
+    }
+};
+</script>
+<style scoped lang='scss'>
+.scheduling {
+    height: 100%;
+    &-table {
+        text-align: center;
+        height: calc(100% - 100px);
+        width: 100%;
+        padding: 20px;
+        background: #ffffff;
+        border-radius: 4px;
+        &-head {
+            display: grid;
+            grid-template-columns: 2fr 2fr 2fr 2fr 2fr 2fr 2fr;
+        }
+        &-head {
+            line-height: 45px;
+            background: #f8fcff;
+            border: 1px solid #e0e1e3;
+            .head-week {
+                border-left: 1px solid #e0e1e3;
+                &:first-of-type {
+                    border: none;
+                }
+            }
+        }
+    }
+}
+</style>

operationSupport/src/views/patrolManagement/popups/weekEditAdd.vue

@@ -0,0 +1,132 @@
+<template>
+    <el-form class="timeNewStyle" :model="timePeriod" :rules="formRules" ref="formRu">
+        <el-form-item label="巡更日期">{{ thisDay.day | dateText }}</el-form-item>
+        <el-form-item :label="timePeriod.partrolTime" prop="partolUserId">
+            <el-cascader
+                :ref="`userName`"
+                v-model="timePeriod.partolUserId"
+                :props="defaultProps"
+                :options="findUser"
+                :show-all-levels="false"
+                @change="findUserToggle()"
+            >
+            </el-cascader>
+        </el-form-item>
+    </el-form>
+</template>
+<script>
+export default {
+    props: ['params'],
+    data() {
+        return {
+            timePeriod: {},
+            findUser: [],
+            thisDay: {},
+            defaultProps: {
+                value: 'id', // 唯一标识
+                label: 'label', // 标签显示
+                multiple: true,
+                emitPath: false
+            },
+            timePeriod: {
+                partolUserId: '',
+                partolName: '',
+                partrolTime: ''
+            },
+            formRules: {
+                partolUserId: [this.$valid.selectRequired('巡更人')]
+            }
+        };
+    },
+    filters: {
+        dateText(va) {
+            if (!!va) {
+                let timeAr = va.split('-');
+                return `${timeAr[0]}年${timeAr[1]}月${timeAr[2]}日`;
+            } else {
+                return '';
+            }
+        }
+    },
+    methods: {
+        findUserToggle() {
+            // let thisObj = this.$refs[`userName`].getCheckedNodes()[0];
+            // this.timePeriod.partolName = thisObj.label;
+        },
+        submit() {
+            this.$refs['formRu'].validate((valid) => {
+                if (valid) {
+                    let selectAll = this.$refs[`userName`].getCheckedNodes();
+                    let partolNames = [],
+                        partolUserIds = [];
+                    selectAll.map((item) => {
+                        if (item.level !== 1 && item.children.length == 0) {
+                            partolNames.push(item.label);
+                            partolUserIds.push(item.value);
+                        }
+                    });
+                    this.add(partolNames, partolUserIds);
+                }
+            });
+        },
+        add(names, ids) {
+            let data = this.params.item;
+            let initData = {
+                communityId: data.communityId,
+                patrolRouteId: data.id,
+                periodType: data.periodType,
+                periodValue: data.periodValue,
+                rosterUserDtos: [
+                    {
+                        partolName: names.join(','),
+                        partolUserId: ids.join(','),
+                        partrolTime: data.times
+                    }
+                ],
+                partrolDate: this.thisDay.day,
+                startDate: data.startDate,
+                endDate: data.endDate
+            };
+            var loading = this.$loading();
+            this.$http
+                .post('/sc-community/patrolRoute/roster', initData)
+                .then(({ data, status, msg }) => {
+                    if (status == 0) {
+                        this.$message.success(msg);
+                        this.params.callback();
+                        this.$emit('close');
+                    } else {
+                        this.$message.error(msg);
+                    }
+                    loading.close();
+                })
+                .catch(() => {
+                    loading.close();
+                });
+        }
+    },
+    created() {
+        this.findUser = this.params.findUser;
+        this.thisDay.day = this.params.dateDe;
+        this.timePeriod = {
+            partolName: '',
+            partolUserId: '',
+            partrolTime: this.params.item.times
+        };
+    },
+    mounted() {}
+};
+</script>
+<style scoped lang='scss'>
+.timeNewStyle {
+    /deep/ .el-date-editor--daterange.el-input__inner {
+        width: 100%;
+    }
+    /deep/.el-form-item__label {
+        width: 120px !important;
+    }
+    /deep/ .el-form-item__content {
+        margin-left: 120px !important;
+    }
+}
+</style>