root
/
NanJingLamanRadarProject
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge branch 'master' of http://112.124.40.88:5510/root/NanJingLamanRadarProject

master
xuhuihui 3 years ago
parent
00fef41648 751fb69a28
commit
808bbbf22f
3 changed files with 61 additions and 66 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 5
      04.系统编码/Frontend/src/App.vue
  2. 4
      04.系统编码/Frontend/src/components/DecisionSupport.vue
  3. 118
      04.系统编码/Frontend/src/components/RamanLidar.vue

5
04.系统编码/Frontend/src/App.vue
View File

@ -19,6 +19,9 @@
onMounted(() => { onMounted(() => {
getRem(1920, 100); getRem(1920, 100);
window.onresize = () => getRem(1920, 100); window.onresize = () => getRem(1920, 100);
// window.onbeforeunload = () => {
// clear()
// }
}) })
@ -33,8 +36,6 @@
html.style.fontSize = oWidth / pwidth*prem + "px"; html.style.fontSize = oWidth / pwidth*prem + "px";
} }
return {showHeader} return {showHeader}
} }
} }

4
04.系统编码/Frontend/src/components/DecisionSupport.vue
View File

@ -200,8 +200,8 @@ import { post } from '../uilts/axios';
height: calc(~"100% - 0.6rem"); height: calc(~"100% - 0.6rem");
padding: 0.2rem 0 0.2rem 0.2rem; padding: 0.2rem 0 0.2rem 0.2rem;
.save-btn { .save-btn {
top: 0.6rem; top: 0.2rem;
right: 0.6rem; right: 0.2rem;
} }
.advice-picture-view { .advice-picture-view {
width: 100%; width: 100%;

118
04.系统编码/Frontend/src/components/RamanLidar.vue
View File

@ -21,11 +21,10 @@
</div> </div>
</div> </div>
<div class="container panel"> <div class="container panel">
<div class="toolbar"> <div class="toolbar raman-toolbar">
<div class="times"> <div class="times">
<div class="time-item" v-for="(time, index) in times" :key="index" :class="{'active': currentTime === time.date, 'first-hour': time.minute === '00'}"> <div class="time-item" v-for="(time, index) in times" :key="index" :class="{'active': currentTime === time.date}">
<span class="hour">{{time.hour}}</span> <span class="minute" @click="onTimeClick(time, index)">{{time.day}}</span>
<span class="minute" @click="onTimeClick(time, index)">{{time.minute}}</span>
</div> </div>
</div> </div>
<el-date-picker v-model="date" type="date" placeholder="请选择" :clearable="false" :editable="false" class="date-picker" @change="onChange"> <el-date-picker v-model="date" type="date" placeholder="请选择" :clearable="false" :editable="false" class="date-picker" @change="onChange">
@ -34,16 +33,6 @@
<span @click="onPrevDayClick"><img src="/images/prev.png" /></span> <span @click="onPrevDayClick"><img src="/images/prev.png" /></span>
<span @click="onNextDayClick"><img src="/images/next.png" /></span> <span @click="onNextDayClick"><img src="/images/next.png" /></span>
</div> </div>
<el-select v-model="currentHour" @change="onChange">
<el-option
v-for="item in hours"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
<p class="unit">时</p>
<div class="refresh-btn" @click="onRefreshClick"> <div class="refresh-btn" @click="onRefreshClick">
<img src="/images/refresh.png" /> <img src="/images/refresh.png" />
</div> </div>
@ -98,9 +87,7 @@ import { post } from '../uilts/axios';
currentRegion: 'jiangning', currentRegion: 'jiangning',
currentElement: 'lidar-ratio', currentElement: 'lidar-ratio',
currentType: '激光雷达比', currentType: '激光雷达比',
date: moment('2021-11-01').format('YYYY-MM-DD'), date: moment('2021-08-21').format('YYYY-MM-DD'),
currentHour: '10',
hours: [],
times: [], times: [],
currentTime: null, currentTime: null,
imgUrl: '/images/default-picture.png', imgUrl: '/images/default-picture.png',
@ -113,38 +100,38 @@ import { post } from '../uilts/axios';
}) })
onMounted(() => { onMounted(() => {
initHours();
initTimeLine(); initTimeLine();
setTitle(moment(options.date, 'YYYY-MM-DD').hour(parseInt(options.currentHour))); setTitle(moment(options.date, 'YYYY-MM-DD'));
setTimeout(() => { setTimeout(() => {
activeImage(moment(options.times[options.times.length - 1].date).hour(), moment(options.times[options.times.length - 1].date).minute()); activeImage();
}, 50); }, 50);
}) })
const onRegionClick = (region) => { const onRegionClick = (region) => {
options.currentRegion = region; options.currentRegion = region;
options.date = options.currentTime;
cancelActive(); cancelActive();
setTitle(moment(options.date).hour(parseInt(options.currentHour))); setTitle(moment(options.date));
activeImage(moment(options.times[options.index].date).hour(), moment(options.times[options.index].date).minute()); activeImage();
} }
const onElementClick = (element, type) => { const onElementClick = (element, type) => {
options.currentElement = element; options.currentElement = element;
options.currentType = type options.currentType = type;
options.date = options.currentTime;
cancelActive(); cancelActive();
setTitle(moment(options.date).hour(parseInt(options.currentHour))); setTitle(moment(options.date));
activeImage(moment(options.times[options.index].date).hour(), moment(options.times[options.index].date).minute()); activeImage();
} }
const setTitle = (date) => { const setTitle = (date) => {
options.title = date.format('YYYY.MM.DD HH:mm') + ' ' + options.currentType; options.title = date.format('YYYY.MM.DD') + ' ' + options.currentType;
} }
const activeImage = (hour, minute) => { const activeImage = () => {
let time = moment(options.date).hour(hour).minute(minute); options.imgUrl = RamanLidarConfig.getUrl(options.currentRegion, options.currentElement, moment(options.currentTime, 'YYYY-MM-DD'));
options.imgUrl = RamanLidarConfig.getUrl(options.currentRegion, options.currentElement, time);
options.srcList = [options.imgUrl]; options.srcList = [options.imgUrl];
} }
@ -220,44 +207,29 @@ import { post } from '../uilts/axios';
const initTimeLine = () => { const initTimeLine = () => {
options.times = []; options.times = [];
options.currentTime = moment(options.date).hour(parseInt(options.currentHour)).format('YYYY-MM-DD HH:mm'); options.currentTime = moment(options.date).format('YYYY-MM-DD');
let now = moment(options.date).hour(parseInt(options.currentHour) - 2); let now = moment(options.date).add(1, 'day');
let minute = now.minute();
const remainder = minute % 6;
if (remainder > 0){
now.minute(minute + (6 - remainder));
}
now.minute(now.minute() - 6);
for (let i = 0; i < 21 ; i++) { for (let i = 0; i < 21 ; i++) {
options.times.push({ options.times.push({
hour: now.add(6, 'minute').format('HH时'), day: now.add(-1, 'day').format('DD'),
minute: now.format('mm'), date: now.format('YYYY-MM-DD'),
date: now.format('YYYY-MM-DD HH:mm'), })
name: 'hour' + now.format('HH')
});
} }
options.times.reverse();
options.index = options.times.length - 1; options.index = options.times.length - 1;
}
const initHours = () => {
for (let i = 0; i < 23; i++) {
options.hours.push({
value: i,
label: i < 10 ? '0' + i : i,
})
}
} }
const onTimeClick = (time, index) => { const onTimeClick = (time, index) => {
options.currentTime = time.date; options.currentTime = time.date;
options.date = time.date;
options.index = index; options.index = index;
cancelActive(); cancelActive();
setTitle(moment(time.date, 'YYYY-MM-DD HH:mm')); setTitle(moment(time.date, 'YYYY-MM-DD'));
activeImage(moment(time.date).hour(), moment(time.date).minute()); activeImage();
} }
const cancelActive = () => { const cancelActive = () => {
@ -266,7 +238,18 @@ import { post } from '../uilts/axios';
} }
const onPrevDayClick = () => { const onPrevDayClick = () => {
options.date = moment(options.date).add(-1, 'day').format('YYYY-MM-DD') let element = getCurrentElement();
options.date = moment(options.date).add(-1, 'day').format('YYYY-MM-DD');
options.currentTime = options.date;
options.index--;
if (options.index < 0) {
options.index = element.childElementCount - 1;
options.date = options.times[options.times.length - 1].date
}
cancelActive();
setCurrentPlayElement(element)
} }
const onNextDayClick = () => { const onNextDayClick = () => {
@ -274,7 +257,6 @@ import { post } from '../uilts/axios';
} }
const onPrevImgClick = () => { const onPrevImgClick = () => {
console.log(options.index);
let element = getCurrentElement(); let element = getCurrentElement();
options.index--; options.index--;
@ -296,9 +278,8 @@ import { post } from '../uilts/axios';
const onRefreshClick = () => { const onRefreshClick = () => {
cancelActive(); cancelActive();
options.date = moment('2021-11-01').format('YYYY-MM-DD'); options.date = moment('2021-08-21').format('YYYY-MM-DD');
options.currentTime = options.times[options.times.length - 1]; options.currentTime = options.times[options.times.length - 1];
options.currentHour = '10';
} }
const onPlayClick = () => { const onPlayClick = () => {
@ -339,14 +320,14 @@ import { post } from '../uilts/axios';
element.children[options.index].classList.add('active'); element.children[options.index].classList.add('active');
options.currentTime = options.times[options.index].date; options.currentTime = options.times[options.index].date;
setTitle(moment(options.times[options.index].date, 'YYYY-MM-DD HH:mm')); setTitle(moment(options.times[options.index].date, 'YYYY-MM-DD'));
activeImage(moment(options.times[options.index].date).hour(), moment(options.times[options.index].date).minute()); activeImage();
} }
const onChange = () => { const onChange = () => {
initTimeLine(); initTimeLine();
setTitle(moment(options.date).hour(parseInt(options.currentHour))); setTitle(moment(options.date));
activeImage(moment(options.times[options.index].date).hour(), moment(options.times[options.index].date).minute()); activeImage();
} }
return { return {
@ -368,4 +349,17 @@ import { post } from '../uilts/axios';
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.main {
.container {
.raman-toolbar {
.times {
.time-item {
.minute {
line-height: 0.46rem;
}
}
}
}
}
}
</style> </style>

Write Preview
Loading…
Cancel
Save