From 90e466c3e52c189e802ad1898becba54c55d91e8 Mon Sep 17 00:00:00 2001
From: zhuzhuanzhuan
Date: 星期三, 09 八月 2023 15:03:58 +0800
Subject: [PATCH] 部门产线的权限控制、设备工作日历界面的样式调整
---
src/views/mdc/base/modules/deviceCalendar/DeviceCalendarModel.vue | 405 ++++++++++++++++++++++++++++++++++++---------------------
1 files changed, 255 insertions(+), 150 deletions(-)
diff --git a/src/views/mdc/base/modules/deviceCalendar/DeviceCalendarModel.vue b/src/views/mdc/base/modules/deviceCalendar/DeviceCalendarModel.vue
index 6a82095..bb315ce 100644
--- a/src/views/mdc/base/modules/deviceCalendar/DeviceCalendarModel.vue
+++ b/src/views/mdc/base/modules/deviceCalendar/DeviceCalendarModel.vue
@@ -1,6 +1,6 @@
<template>
<div ref="device">
- <a-modal :title="title" :width="800" :visible="visible" :confirmLoading="confirmLoading" :getContainer="() => this.$refs.device"
+ <a-modal :title="title" :width="900" :visible="visible" :confirmLoading="confirmLoading" :getContainer="() => this.$refs.device"
:okButtonProps="{ props: {disabled: disableSubmit} }" @ok="handleOk" @cancel="handleCancel" cancelText="鍏抽棴">
<a-spin :spinning="confirmLoading">
<a-form :form="form">
@@ -13,22 +13,8 @@
</a-col>
</a-row>
<a-row :gutter="24">
- <a-col :span="12">
- <a-form-item label="鐢熸晥鏃堕棿" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <a-date-picker v-decorator="['takeEffectDate',validatorRules.takeEffectDate]" :disabled="disableSubmit"
- :readOnly="disableSubmit" :disabledDate="disabledDate"/>
- </a-form-item>
- </a-col>
- <a-col :span="12">
- <a-form-item label="澶辨晥鏃堕棿" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <a-date-picker v-decorator="['invalidDate',validatorRules.invalidDate]" :disabled="disableSubmit"
- :readOnly="disableSubmit" :disabledDate="disabledDateEnd"/>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="24">
- <a-col :span='12'>
- <a-form-item label="鏄熸湡涓�" :labelCol="labelCol" :wrapperCol="wrapperCol">
+ <a-col :span="24">
+ <a-form-item label="鐝埗" :labelCol="labelColLong" :wrapperCol="wrapperColLong">
<a-select v-decorator="['monShiftId', validatorRules.monShiftId]" placeholder="璇烽�夋嫨鐝埗"
:allowClear='allowClear' @change="initShiftSubList">
<a-select-option v-for="(em,index) in shiftList" :key="index" :value="em.value">
@@ -37,112 +23,24 @@
</a-select>
</a-form-item>
</a-col>
- <a-col :span="12">
- <a-form-item label="鏄熸湡浜�" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <a-select v-decorator="['tueShiftId', validatorRules.tueShiftId]" placeholder="璇烽�夋嫨鐝埗"
- :allowClear='allowClear' @change="initShiftSubList">
- <a-select-option v-for="(em,index) in shiftList" :key="index" :value="em.value">
- {{ em.label }}
- </a-select-option>
- </a-select>
- </a-form-item>
- </a-col>
</a-row>
+
<a-row :gutter="24">
- <a-col :span='12'>
- <a-form-item label="鏄熸湡涓�" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <a-select v-decorator="['wedShiftId', validatorRules.wedShiftId]" placeholder="璇烽�夋嫨鐝埗"
- :allowClear='allowClear' @change="initShiftSubList">
- <a-select-option v-for="(em,index) in shiftList" :key="index" :value="em.value">
- {{ em.label }}
- </a-select-option>
- </a-select>
- </a-form-item>
- </a-col>
- <a-col :span="12">
- <a-form-item label="鏄熸湡鍥�" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <a-select v-decorator="['thuShiftId', validatorRules.thuShiftId]" placeholder="璇烽�夋嫨鐝埗"
- :allowClear='allowClear' @change="initShiftSubList">
- <a-select-option v-for="(em,index) in shiftList" :key="index" :value="em.value">
- {{ em.label }}
- </a-select-option>
- </a-select>
- </a-form-item>
+ <a-col :span="24">
+ <a-form-item label="鐢熸晥鏃堕棿" :labelCol="labelColLong" :wrapperCol="wrapperColLong">
+ <div class="mainBox">
+ <Calendar
+ v-on:choseDay="clickDay"
+ v-on:changeMonth="changeDate"
+ v-on:isToday="clickToday"
+ :markDate = 'shiData'
+ :agoDayHide = 'value'
+ ></Calendar>
+ </div>
+
+ </a-form-item>
</a-col>
</a-row>
- <a-row :gutter="24">
- <a-col :span='12'>
- <a-form-item label="鏄熸湡浜�" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <a-select v-decorator="['friShiftId', validatorRules.friShiftId]" placeholder="璇烽�夋嫨鐝埗"
- :allowClear='allowClear' @change="initShiftSubList">
- <a-select-option v-for="(em,index) in shiftList" :key="index" :value="em.value">
- {{ em.label }}
- </a-select-option>
- </a-select>
- </a-form-item>
- </a-col>
- <a-col :span="12">
- <a-form-item label="鏄熸湡鍏�" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <a-select v-decorator="['satShiftId', validatorRules.satShiftId]" placeholder="璇烽�夋嫨鐝埗"
- :allowClear='allowClear' @change="initShiftSubList">
- <a-select-option v-for="(em,index) in shiftList" :key="index" :value="em.value">
- {{ em.label }}
- </a-select-option>
- </a-select>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="24">
- <a-col :span='12'>
- <a-form-item label="鏄熸湡鏃�" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <a-select v-decorator="['sunShiftId', validatorRules.sunShiftId]" placeholder="璇烽�夋嫨鐝埗"
- :allowClear='allowClear' @change="initShiftSubList">
- <a-select-option v-for="(em,index) in shiftList" :key="index" :value="em.value">
- {{ em.label }}
- </a-select-option>
- </a-select>
- </a-form-item>
- </a-col>
- <a-col :span="12">
- </a-col>
- </a-row>
- <!--<a-row :gutter="24">-->
- <!--<a-col :span="12">-->
- <!--<a-form-item label="璁惧" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
- <!--<a-input v-decorator="['equmentName',validatorRules.equmentName]" :disabled="true" :readOnly="true"/>-->
- <!--</a-form-item>-->
- <!--</a-col>-->
- <!--<a-col :span="12">-->
- <!--<a-form-item label="鏄惁璺ㄥぉ" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
- <!--<a-switch v-model="isDaySpan" :disabled="true" checked-children="鏄�" un-checked-children="鍚�"/>-->
- <!--</a-form-item>-->
- <!--</a-col>-->
- <!--</a-row>-->
- <!--<a-row :gutter="24">-->
- <!--<a-col :span="12">-->
- <!--<a-form-item label="寮�濮嬫椂闂�" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
- <!--<a-input v-decorator="['startDate',validatorRules.startDate]" :disabled="true" :readOnly="true"/>-->
- <!--</a-form-item>-->
- <!--</a-col>-->
- <!--<a-col :span="12">-->
- <!--<a-form-item label="缁撴潫鏃堕棿" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
- <!--<a-input v-decorator="['endDate',validatorRules.endDate]" :disabled="true" :readOnly="true"/>-->
- <!--</a-form-item>-->
- <!--</a-col>-->
- <!--</a-row>-->
- <!--<a-row :gutter="24">-->
- <!--<a-col :span="12">-->
- <!--<a-form-item label="寮�濮嬩紤鎭椂闂�" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
- <!--<a-input v-decorator="['sleepStartDate',validatorRules.sleepStartDate]" :disabled="true"-->
- <!--:readOnly="true"/>-->
- <!--</a-form-item>-->
- <!--</a-col>-->
- <!--<a-col :span="12">-->
- <!--<a-form-item label="缁撴潫浼戞伅鏃堕棿" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
- <!--<a-input v-decorator="['sleepEndDate',validatorRules.sleepEndDate]" :disabled="true" :readOnly="true"/>-->
- <!--</a-form-item>-->
- <!--</a-col>-->
- <!--</a-row>-->
</a-form>
</a-spin>
<device-calend-list-model ref="deviceRepairListModel" @sendSelectionRows="getDeviceRows"></device-calend-list-model>
@@ -163,12 +61,19 @@
duplicateCheck
} from '@/api/api'
+ import Calendar from 'vue-calendar-component';
+
export default {
name: 'ShiftInfoModel',
- components: {DeviceCalendListModel},
+ components: {DeviceCalendListModel,Calendar},
props: {},
data() {
return {
+ value:'',
+ date:'',
+ week:"",
+ selectDate: [],
+ // 褰撳墠鏃ユ湡
allowClear:true,
title: '',
isDaySpan: false,
@@ -226,13 +131,112 @@
},
shiftList: [],
shiftSubList: [],
- disableSubmit: true
+ disableSubmit: true,
+ calData:undefined,
+ shiData:[],
+ sendDte:[]
}
},
created() {
+ this.value = Math.round(new Date().getTime()/1000).toString()
+ var now = new Date();
+ this.date = now.getDate();//寰楀埌鏃ユ湡
+ var day = now.getDay();//寰楀埌鍛ㄥ嚑
+ var arr_week = new Array("鏄熸湡鏃�", "鏄熸湡涓�", "鏄熸湡浜�", "鏄熸湡涓�", "鏄熸湡鍥�", "鏄熸湡浜�", "鏄熸湡鍏�");
+ this.week = arr_week[day];
+ this.getWorking()
},
methods: {
+ // clickDay(data) {
+ // console.log(data); //閫変腑鏌愬ぉ
+ // },
+ changeDate(data) {
+ console.log(data); //宸﹀彸鐐瑰嚮鍒囨崲鏈堜唤
+ },
+ clickToday(data) {
+ console.log(data); // 璺冲埌浜嗘湰鏈�
+ },
+ // markChange(){
+ //
+ // },
+ getWorking(){//鑾峰彇褰撳墠鏈堝伐浣滄棩
+ let myDate = new Date();
+ let tY = myDate.getFullYear();//寰楀埌褰撳墠骞�
+ let tM = myDate.getMonth();//寰楀埌褰撳墠鏈�+1
+ let tD = new Date(tY,tM+1,0);
+ let tT=tD.getDate();//寰楀埌褰撳墠鏈堢殑澶╂暟
+
+ for(var i=1;i<=tT;i++){
+ let week =new Date(tY,tM,i).getDay()
+ if(week>=1&&week<=5){
+ let dd = tY + "/" + (tM + 1) + "/" + i;
+ let temp={className: "mark1",date:dd}
+ this.selectDate.push(temp)
+ }
+ }
+//console.log(JSON.stringify(this.selectDate))
+ },
+ resetSelect(){//閲嶇疆閫変腑鐨勬棩鏈�
+ this.selectDate=[]
+ this.shiData = []
+ this.sendDte = []
+ },
+ fun(obj){
+ console.log(obj)
+ if(obj){
+ if(obj = obj.split("/")){
+ var timShi = obj[1];
+ var timFen = obj[2];
+ if(timShi < 10){
+ timShi = '0'+timShi
+ }
+ if(timFen < 10){
+ timFen = '0'+timFen
+ }
+ var dd = (obj[0] + timShi +timFen)
+ return dd
+ }
+ }
+ },
+ clickDay(today){//閫変腑鏃ユ湡
+ // today = this.fun(today)
+ console.log("褰撳墠閫変腑鏃ユ湡===>", today);
+ let existDate = this.selectDate;
+ let isExist = true;
+ for (var i = 0; i < existDate.length; i++) {
+ if (existDate[i].date === today) {
+ console.log("褰撳墠鏃ユ湡瀛樺凡鍦�===>",today);
+ this.selectDate.splice(i,1);
+ this.shiData.splice(i,1);
+ this.sendDte.splice(i,1)
+ isExist = false;
+ }
+ }
+ if (isExist) {//褰撳墠鏃ユ湡瀛樺湪绉婚櫎
+ console.log("涓嶅瓨鍦�-娣诲姞===>");
+ let tempDate = {date: today, className: "mark1"}
+ // let ddd = this.fun(today)
+ let ddd = today
+ let ccc = this.fun(today)
+ this.selectDate.push(tempDate)
+ this.shiData.push(ddd)
+ this.sendDte.push(ccc)
+ }
+ console.log("this.selectDate===>",JSON.stringify(this.selectDate));
+ console.log(this.sendDte)
+ },
+ onSelect(value) {
+ console.log(value);
+ let arr = []
+ arr.push(value);
+ this.value = arr
+ // this.value = value;
+ // this.selectedValue = value;
+ },
+ onPanelChange(value) {
+ this.value = value;
+ },
deviceSearch() {
this.$refs.deviceRepairListModel.openPage()
this.$refs.deviceRepairListModel.title = '閫夋嫨璁惧'
@@ -276,16 +280,17 @@
// })
},
add(record) {
+ this.resetSelect()
let _this = this
this.visible = true
this.form.resetFields()
this.model = Object.assign({}, record)
this.initShiftList()
this.$nextTick(() => {
- this.form.setFieldsValue(pick(this.model, 'equmentName'))
+ this.form.setFieldsValue(pick(this.model))
this.form.setFieldsValue({
- takeEffectDate: moment(),
- invalidDate: moment().endOf('month')
+ // takeEffectDate: moment(),
+ // invalidDate: moment().endOf('month')
})
})
},
@@ -301,6 +306,9 @@
if (!err) {
that.confirmLoading = true
let formData = Object.assign(this.model, values)
+
+ formData.dateList = this.sendDte
+ console.log(formData)
postAction(this.url.settingCalendar, formData).then((res) => {
if (res.success) {
that.$message.success(res.message)
@@ -318,37 +326,14 @@
handleCancel() {
this.close()
},
- // shiftSubChange(val) {
- // let _this = this
- // getAction(this.url.getShiftSubById, { shiftSubId: val }).then((res) => {
- // if (res.success) {
- // if (res.result.isDaySpan == 'true') {
- // _this.isDaySpan = true
- // } else {
- // _this.isDaySpan = false
- // }
- // _this.form.setFieldsValue({
- // startDate: res.result.startDate,
- // endDate: res.result.endDate
- // })
- // if (res.result.sleepStartDate) {
- // _this.form.setFieldsValue({
- // sleepStartDate: res.result.sleepStartDate
- // })
- // }
- // if (res.result.sleepStartDate) {
- // _this.form.setFieldsValue({
- // sleepEndDate: res.result.sleepEndDate
- // })
- // }
- // }
- // })
- // }
+
}
}
</script>
<style scoped lang="less">
+
+
/deep/ .ant-modal-content{
/*background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.27) 100%);*/
/*background: -webkit-gradient(linear, left left, right right, color-stop(0%, rgba(0, 0, 0, 0.66)), color-stop(100%, rgba(0, 0, 0, 0.4)));*/
@@ -383,4 +368,124 @@
.ant-tabs-content .ant-form-item {
margin-bottom: 0px;
}
+
+ /deep/ .mark1{
+ color:white!important;
+ background-color: #1890ff!important;
+ border-radius: 50%;
+ }
+ /deep/.mainBox .wh_content_all{
+ background-color: #ffffff;
+ border: 1px silver solid;
+ -webkit-border-radius: 5px;
+ -moz-border-radius: 5px;
+ border-radius: 5px;
+ }
+ /deep/ .mainBox .wh_content_all .wh_jiantou1{
+ border-top: 2px solid #000000;
+ border-left: 2px solid #000000;
+ }
+ /deep/ .mainBox .wh_content_all .wh_jiantou2{
+ border-top: 2px solid #000000;
+ border-right: 2px solid #000000;
+ }
+ /deep/ .mainBox .wh_content_all .wh_top_changge li{
+ color: black;
+ }
+ /deep/ .mainBox .wh_content_all .wh_content_item{
+ margin-top: 5px;
+ }
+ /deep/ .mainBox .wh_content_all .wh_content_item .wh_top_tag{
+ color: #000000;
+ }
+ /deep/ .mainBox .wh_content_all .wh_content_item .wh_item_date {
+ color: #000000;
+ }
+ /deep/ .mainBox .wh_content_all .wh_content_item .wh_item_date:hover{
+ color: #1890ff;
+ border:1px solid #1890ff;
+ border-radius: 50%;
+ }
+ /deep/ .mainBox .wh_content_all .wh_content_item .wh_other_dayhide{
+ color: #bfbfbf!important;
+ }
+ /deep/ .mainBox .wh_content_all .wh_content_item .wh_want_dayhide{
+ color: #bfbfbf!important;
+ }
+ /deep/ .mainBox .wh_content_all .wh_content_item .wh_chose_day{
+ background: #ffffff;
+ color: #000000;
+ }
+ /deep/ .mainBox .wh_content_all .wh_content_item .wh_isMark {
+ color: #1890ff;
+ border:1px solid #1890ff;
+ border-radius: 50%;
+ }
+ /deep/ .mainBox .wh_content_all .wh_content_item .wh_isToday {
+ /*background: #33ad53;*/
+ /*background: #ff4d4d!important;*/
+ background-color: #ffffff;
+ color: #000000;
+ }
+
</style>
+
+<!--<style lang="scss">-->
+
+ <!--.mark1 {-->
+ <!--color: white !important;-->
+ <!--background: #1890ff !important;-->
+ <!--border-radius: 50%;-->
+ <!--}-->
+
+ <!--.mainBox {-->
+ <!--.wh_content_all { /*涓讳綋*/-->
+ <!--background-color: #ffffff;-->
+ <!--border: 1px silver solid;-->
+ <!--border-radius: 5px;-->
+ <!--.wh_jiantou1{/*宸︾澶�*/-->
+ <!--border-top: 2px solid #000000;-->
+ <!--border-left: 2px solid #000000;-->
+ <!--}-->
+ <!--.wh_jiantou2{/*鍙崇澶�*/-->
+ <!--border-top: 2px solid #000000;-->
+ <!--border-right: 2px solid #000000;-->
+ <!--}-->
+ <!--.wh_top_changge li { /*褰撳墠骞存湀鏍囬*/-->
+ <!--color: black;-->
+ <!--}-->
+ <!--.wh_content_item {-->
+ <!--margin-top: 5px;-->
+ <!--.wh_top_tag{/*鏄熸湡鏍囬*/-->
+ <!--color: #000000;-->
+ <!--}-->
+ <!--.wh_item_date {/*褰撳墠鏈�*/-->
+ <!--color: #000000;-->
+ <!--}-->
+ <!--.wh_item_date:hover { //鎮诞-->
+ <!--color: #1890ff;-->
+ <!--background: #ffffff;-->
+ <!--border-radius: 50%;-->
+ <!--}-->
+ <!--.wh_other_dayhide { /*涓婃湀鍜屼笅鏈堟椂闂�*/-->
+ <!--color: #bfbfbf;-->
+ <!--}-->
+ <!--.wh_chose_day { //閫変腑-->
+ <!--background: #ffffff;-->
+ <!--color: #000000;-->
+ <!--}-->
+ <!--.wh_isToday { /*褰撳墠澶�*/-->
+ <!--/*background: #33ad53;*/-->
+ <!--background: #ff4d4d;-->
+ <!--color: #ffffff;-->
+ <!--}-->
+ <!--}-->
+
+ <!--}-->
+ <!--}-->
+<!--</style>-->
+
+
+
+
+
--
Gitblit v1.9.3