提交 2f250f54 编写于 作者: xiaoping.di's avatar xiaoping.di

Merge branch 'feature/dxp' into 'develop'

Feature/dxp

See merge request !157
{
// 是否允许自定义的snippet片段提示
"editor.snippetSuggestions": "top",
// vscode默认启用了根据文件类型自动设置tabsize的选项
"editor.detectIndentation": false,
// 重新设定tabsize
"editor.tabSize": 2,
// #每次保存的时候自动格式化
"editor.formatOnSave": false,
// #每次保存的时候将代码按eslint格式进行修复
"eslint.autoFixOnSave": true,
"editor.fontWeight": "300",
"editor.formatOnType": false,
"workbench.iconTheme": "material-icon-theme",
"git.confirmSync": false,
"team.showWelcomeMessage": false,
"window.zoomLevel": 0,
// "editor.renderWhitespace": "boundary",
"editor.cursorBlinking": "smooth",
"editor.minimap.enabled": true,
// "editor.minimap.renderCharacters": false,
"window.title": "${dirty}${activeEditorMedium}${separator}${rootName}",
"editor.codeLens": true,
//eslint 代码自动检查相关配置
"eslint.enable": true,
"eslint.run": "onType",
"eslint.options": {
"extensions": [
".js",
".vue"
]
},
// 添加 vue 支持
"eslint.validate": [
"javascriptreact",
"vue",
"javascript",
{
"language": "vue",
"autoFix": true
},
"html",
{
"language": "html",
"autoFix": true
}
],
// #让prettier使用eslint的代码格式进行校验
"prettier.eslintIntegration": true,
// #去掉代码结尾的分号
"prettier.semi": false,
// #使用带引号替代双引号
"prettier.singleQuote": true,
// #让函数(名)和后面的括号之间加个空格
"javascript.format.insertSpaceBeforeFunctionParenthesis": true,
// #这个按用户自身习惯选择
"vetur.format.defaultFormatter.html": "js-beautify-html",
// #让vue中的js按编辑器自带的ts格式进行格式化
"vetur.format.defaultFormatter.js": "vscode-typescript",
"explorer.confirmDelete": false,
"vetur.format.defaultFormatterOptions": {
"js-beautify-html": {
"wrap_attributes": "force-aligned"
// #vue组件中html代码格式化样式
}
},
"files.associations": {
"*.cjson": "jsonc",
"*.wxss": "css",
"*.wxs": "javascript"
},
"emmet.includeLanguages": {
"wxml": "html"
},
"minapp-vscode.disableAutoConfig": true,
"window.menuBarVisibility": "visible",
"git.enableSmartCommit": true,
"git.autofetch": true,
"liveServer.settings.donotShowInfoMsg": true,
"[html]": {
"editor.defaultFormatter": "vscode.html-language-features"
},
"javascript.updateImportsOnFileMove.enabled": "always",
"workbench.colorTheme": "SynthWave '84",
"editor.fontSize": 16,
"search.followSymlinks": false,
"workbench.sideBar.location": "left",
// 是否开启保存自动格式化
"zenMode.restore": true,
"breadcrumbs.enabled": true,
"gitlens.advanced.messages": {
"suppressLineUncommittedWarning": true
},
"javascript.format.placeOpenBraceOnNewLineForControlBlocks": true,
"editor.formatOnPaste": false,
"editor.cursorStyle": "line-thin",
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
}
}
.agment-box {
height: 100%;
background: #fff;
overflow: hidden;
padding: 20px;
border-radius: 6px;
flex: 3.8;
}
.agment-box-left {
flex: 1;
height: 100%;
padding: 20px;
margin-left: 12px;
background: #fff;
border-radius: 6px;
}
.agment-left-con {
margin-top: 70px;
background: #f0f2f5;
height: auto;
padding: 20px;
overflow: hidden;
border-radius: 8px;
}
.agment-head {
border-radius: 5px;
display: flex;
justify-content: flex-start;
align-items: flex-end;
}
.agment-head-name {
font-size: 20px;
color: #02120f;
font-weight: 600;
}
.agment-head-phone {
font-size: 18px;
margin-left: 16px;
}
.agment-hospital {
color: #89888b;
font-size: 16px;
margin-top: 14px;
line-height: 24px;
}
.agment-hospital-ks {
margin-top: 8px;
}
.agment-head-title {
font-size: 14px;
color: #02120f;
margin-top: 19px;
}
.agment-head-priority {
padding-top: 20px;
display: flex;
justify-content: space-between;
align-items: center;
.item {
width: 42px;
height: 32px;
border: 1px solid #d9d9d9;
border-radius: 8px;
text-align: center;
line-height: 32px;
cursor: pointer;
}
.active {
color: #fff;
background: #0d9078;
border: none;
}
}
.agment-left-button {
margin-top: 34px;
display: flex;
justify-content: space-around;
}
/deep/.fc-timegrid-event {
border-radius: 1px !important;
}
/deep/thead .fc-scroller-harness {
background: #fcfbff;
}
/deep/.fc-col-header-cell-cushion {
color: #333;
height: 45px;
line-height: 45px;
}
/deep/.fc .fc-highlight {
background: transparent;
}
/deep/.fc-header-toolbar {
position: absolute;
right: 0;
top: 25px;
width: 20%;
display: flex;
}
/deep/.fc-toolbar-title {
font-size: 6px;
}
/deep/.fc-button-primary {
background: #fff;
color: #02120f;
border-color: #d9d9d9;
border-radius: 8px;
padding: 1.3px 5px;
}
/deep/.fc-button-primary:hover {
background: #fff;
color: #02120f;
}
<template> <template>
<div> <div
<span>{{ schedulingTypeValue }}</span> style="
<span>{{ schedulingType }}</span> width: 100%;
height: auto;
position: relative;
display: flex;
justifycontent: space-between;
"
>
<div class="agment-box">
<FullCalendar :options="calendarOptions" />
</div> </div>
</template> <div class="agment-box-left">
<div class="agment-left-con">
<div class="agment-head">
<div class="agment-head-name">
纵横
</div>
<div class="agment-head-phone">
1897653426
</div>
</div>
<div class="agment-hospital">
上海瑞金医院
</div>
<div class="agment-hospital agment-hospital-ks">
普外科
</div>
</div>
<div style="margin-top: 24px">
<p class="agment-head-title">
选择匹配优先级
</p>
<div class="agment-head-priority">
<!-- <el-button type="primary" plain style="color:#FFF;background:#0D9078">1</el-button>
<el-button type="primary" plain style="color:#FFF;background:#0D9078">2</el-button>
<el-button type="primary" plain style="color:#FFF;background:#0D9078">3</el-button>
<el-button type="primary" plain style="color:#FFF;background:#0D9078">4</el-button>
<el-button type="primary" plain style="color:#FFF;background:#0D9078">5</el-button> -->
<p class="item active">
1
</p>
<p class="item">
2
</p>
<p class="item">
3
</p>
<p class="item">
4
</p>
<p class="item">
5
</p>
</div>
</div>
<div class="agment-left-button">
<el-button
type="primary"
round
style="width: 110px"
>
重置
</el-button>
<el-button
type="primary"
round
style="width: 110px"
>
保存
</el-button>
</div>
</div>
</div>
</template>
<script> <script>
// import '@fullcalendar/core/vdom'
import FullCalendar from '@fullcalendar/vue';
import dayGridPlugin from '@fullcalendar/daygrid';
import timeGridPlugin from '@fullcalendar/timegrid';
import interactionPlugin from '@fullcalendar/interaction';
export default { export default {
name: 'Index',
components: {
FullCalendar,
},
props: { props: {
schedulingTypeValue: { schedulingTypeValue: {
type: Object, type: Object,
...@@ -20,14 +99,222 @@ ...@@ -20,14 +99,222 @@
}, },
}, },
data() { data() {
return {}; return {
listDate: [],
nextBtn: 0,
calendarOptions: {
// 引入的插件,比如fullcalendar/daygrid,fullcalendar/timegrid引入后才可显示月,周,日
plugins: [dayGridPlugin, interactionPlugin, timeGridPlugin],
initialView: 'timeGridWeek', // 默认为那个视图(月:dayGridMonth,周:timeGridWeek,日:timeGridDay)
selectable: true,
selectMirror: true,
selectAllow: this.selectAllow,
selectOverlap: false,
select: this.selectInfo,
selectMinDistance: 0,
eventResize: this.eventResize,
eventDragStop: this.eventDrop,
editable: true,
overlap: false,
defaultDate: new Date(),
datesSet: this.handleDatesSet,
// unselect:this.unSelectInfo,
events: [
{
title: '黄娇变电站3020开关综合检修',
start: '2021-10-18 09:30:00',
end: '2021-10-18 12:30:00',
color: '#FFEDE9',
editable: false,
}, // 可以拖动但不能缩放,但在周、日视图中是可以进行缩放的
// {
// title : '黄娇变电站3020开关综合检修',
// start : '2021-10-19 00:30',
// end : '2021-10-19 04:30',
// color:'#5580EE',
// editable: true
// }, //可以拖动、缩放
// {
// title : '准备公司资料',
// start : '2021-10-21 04:00',
// end : '2021-10-21 07:00',
// color: '#EDB378',
// editable: true,
// // overlap: true,
// // display: 'background',
// },
// {
// title : '准备公司资料',
// start: '2021-10-23 04:00',
// end: '2021-10-23 05:00',
// overlap: false,
// // display: 'background',
// color: '#797979'
// }
// 背景色 (添加相同时间的背景色时颜色会重叠) 一点要初始化日期时间 initialDate: '2020-07-10',
],
header: {
center: 'month,agendaFourDay', // buttons for switching between views
},
views: {
agendaFourDay: {
type: 'agenda',
duration: { days: 4 },
buttonText: '4 day',
},
},
firstDay: new Date().getDay(), // 设置一周中显示的第一天是哪天,周日是0,周一是1,类推
locale: 'zh-cn', // 切换语言,当前为中文
eventColor: '#fff', // 全部日历日程背景色3BB2E3
eventBackgroundColor: '#3788d8',
// themeSystem: 'bootstrap', // 主题色(本地测试未能生效)
// initialDate: moment().format('YYYY-MM-DD'), // 自定义设置背景颜色时一定要初始化日期时间
timeGridEventMinHeight: '40', // 设置事件的最小高度
aspectRatio: 1.35, // 设置日历单元格宽度与高度的比例。
// displayEventTime: false, // 是否显示时间
allDaySlot: false, // 周,日视图时,all-day 不显示
eventLimit: true, // 设置月日程,与all-day slot的最大显示数量,超过的通过弹窗显示
customButtons: {
myCustomButton: {
text: '本周',
},
},
headerToolbar: {
// 日历头部按钮位置
left: '',
center: 'prev myCustomButton next',
right: '',
},
footerToolbar: {
start: 'nni',
},
buttonText: {
// today: '今天',
// month: '月',
// week: '周',
// day: '日'
},
expandRows: true,
slotMinWidth: 50,
slotDuration: '00:30:00',
slotMinTime: '09:30',
slotMaxTime: '19:30',
slotLabelInterval: '',
dateClick: this.dateClick,
scrollTime: false,
slotLabelFormat: {
hour: 'numeric',
minute: '2-digit',
meridiem: 'short',
hour12: false, // 设置时间为24小时
},
eventLimitNum: {
// 事件显示数量限制(本地测试未能生效)
dayGrid: {
eventLimit: 5,
},
timeGrid: {
eventLimit: 4, // adjust to 6 only for timeGridWeek/timeGridDay
},
},
eventClick: this.handleEventClick,
},
workingTicketVisible: false, // 工作表票详情页面
};
},
mounted() {
// this.handleEventClick();
},
methods: {
/**
* 点击日历日程事件
*
* info: 事件信息
* event是日程(事件)对象
* jsEvent是个javascript事件
* view是当前视图对象。
*/
handleDatesSet(dataInfo) {
console.log(dataInfo);
},
prevCustom(mouseEvent, htmlElement) {
alert(1234);
console.log(mouseEvent, htmlElement, 'mouseEvent, htmlElement');
// this.defaultDate=;
},
eventResize(event) {
const index = this.getIdDeleteData(event.event.id);
const oldData = this.calendarOptions.events;
const keyAll = Object.keys(oldData[index]);
const dataObj = {};
keyAll.forEach((item) => {
dataObj[item] = event.event[item];
});
oldData.splice(index, 1, dataObj);
this.getHandleTime(dataObj);
},
handleEventClick(event) {
const index = this.getIdDeleteData(event.event.id);
return this.calendarOptions.events.splice(index, 1);
// alert("你要取消日期吗");
},
unSelectInfo(info) {
console.log(info, '0000');
console.log(99);
},
selectInfo(info) {
const id = (this.calendarOptions.events.length + 1) * 10;
info.id = id;
const keyAll = ['end', 'endStr', 'id', 'start', 'startStr'];
const dataObj = {};
keyAll.forEach((item) => {
dataObj[item] = info[item];
});
this.calendarOptions.events.push(dataObj);
console.log(this.calendarOptions.events, '10000');
},
selectAllow(info) {
const currentDate = new Date();
const start = info.start;
const end = info.end;
return start <= end && start >= currentDate;
},
getIdDeleteData(eventId) {
// 删除现有排班
const data = this.calendarOptions.events;
const index = data.findIndex((event) => event.id == eventId);
return index;
},
getHandleTime(info) {
// 对于排班交叉部分处理
const infoStart = new Date(info.start).getTime();
const infoEnd = new Date(info.end).getTime();
let indexObj = false;
const data = this.calendarOptions.events;
const newDate = [];
data.forEach((item) => {
const d = new Date(item.end).getTime();
const s = new Date(item.start).getTime();
if (s > infoStart && infoEnd >= d) {
indexObj = true;
} else if (s > infoStart && infoEnd >= s) {
indexObj = true;
} else {
const id = (newDate.length + 1) * 10;
item.id = id;
newDate.push(item);
}
});
this.calendarOptions.events = newDate;
console.log(this.calendarOptions.events.length, 'len', indexObj);
},
dateClick(info) {
console.log(info, 'info');
}, },
watch: {},
created() {
console.log(this.schedulingTypeValue, this.schedulingType);
}, },
methods: {},
}; };
</script> </script>
<style></style> <style lang="scss" scoped>
@import 'index';
</style>
...@@ -395,7 +395,6 @@ ...@@ -395,7 +395,6 @@
.serviceSchedule-containerInfo { .serviceSchedule-containerInfo {
position: relative; position: relative;
min-width: 1200px; min-width: 1200px;
background: #ffffff;
height: 73px; height: 73px;
border-radius: 8px; border-radius: 8px;
display: flex; display: flex;
...@@ -484,12 +483,11 @@ ...@@ -484,12 +483,11 @@
width: 100%; width: 100%;
padding: 0 14px; padding: 0 14px;
.serviceSchedule-containerInfo { .serviceSchedule-containerInfo {
background: #ffffff;
border-radius: 8px; border-radius: 8px;
height: 100%; height: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
padding: 21px 18px 20px 18px; //padding: 21px 18px 20px 18px;
} }
} }
} }
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册