diff --git a/src/api/company.js b/src/api/company.js new file mode 100644 index 000000000..a7c1ff06e --- /dev/null +++ b/src/api/company.js @@ -0,0 +1,47 @@ +import request from '@/utils/request'; + +/** 获取公司列表 */ +export function getCompanyList() { + return request({ + url: '/api/company', + method: 'get' + }); +} +/** 添加公司信息 */ +export function addCompany(data) { + return request({ + url: '/api/company', + method: 'post', + data: data + }); +} +/** 删除公司信息 */ +export function deleteCompany(id) { + return request({ + url: `/api/company/${id}`, + method: 'delete' + }); +} +/** 根据id查询公司信心 */ +export function getCompanyById(id) { + return request({ + url: `/api/company/${id}`, + method: 'get' + }); +} +/** 更新公司信息 */ +export function updateCompany(id, data) { + return request({ + url: `/api/company/${id}`, + method: 'put', + data + }); +} +/** 分页查询公司列表 */ +export function getCompanyListPaging(params) { + return request({ + url: `/api/company/paging`, + method: 'get', + params + }); +} diff --git a/src/api/questionsRule.js b/src/api/questionsRule.js new file mode 100644 index 000000000..a9d6668e7 --- /dev/null +++ b/src/api/questionsRule.js @@ -0,0 +1,47 @@ +import request from '@/utils/request'; + +/** 获取出题规则列表 */ +export function getQuestionRuleList() { + return request({ + url: `/api/questionsRule`, + method: 'get' + }); +} +/** 添加出题规则 */ +export function addQuestionRule(data) { + return request({ + url: `/api/questionsRule`, + method: 'post', + data + }); +} +/** 分页获取规则列表 */ +export function getQustionRuleListPage(params) { + return request({ + url: `/api/questionsRule/paging`, + method: 'get', + params + }); +} +/** 删除出题规则 */ +export function deleteQuestionRule(id) { + return request({ + url: `/api/questionsRule/${id}`, + method: 'delete' + }); +} +/** 查询单个出题规则 */ +export function selectedQuestionRule(id) { + return request({ + url: `/api/questionsRule/${id}`, + method: 'get' + }); +} +/** 更改出题规则内容 */ +export function updateQuestionRule(id, data) { + return request({ + url: `/api/questionsRule/${id}`, + method: 'put', + data: data + }); +} diff --git a/src/i18n/langs/en/router.js b/src/i18n/langs/en/router.js index fe7e4b7a6..1ecff02c9 100644 --- a/src/i18n/langs/en/router.js +++ b/src/i18n/langs/en/router.js @@ -81,5 +81,6 @@ export default { raceManage: 'Race manage', practiceManage:'Practice manage', bankManage: 'Bank manage', - sceneManage:'Scene manage' + sceneManage:'Scene manage', + companyManage: 'Company manage' }; diff --git a/src/i18n/langs/zh/router.js b/src/i18n/langs/zh/router.js index 9c8e44e11..dc0645d33 100644 --- a/src/i18n/langs/zh/router.js +++ b/src/i18n/langs/zh/router.js @@ -86,5 +86,6 @@ export default { recaList: '报名列表', bankManage: '题库列表', practiceManage:'实操列表', - sceneManage:'场景列表' + sceneManage:'场景列表', + companyManage: '单位管理' }; diff --git a/src/jmapNew/theme/aus_00/planConvert-.js b/src/jmapNew/theme/aus_00/planConvert-.js new file mode 100644 index 000000000..218bf41ef --- /dev/null +++ b/src/jmapNew/theme/aus_00/planConvert-.js @@ -0,0 +1,139 @@ +import { createMartPointReverse, createSeriesModel, createMarkLineModels, hexColor, convertSheetToList, prefixTime } from '@/utils/runPlan'; + +export default { + /** 边缘高度*/ + EdgeHeight: 600, + + /** 间隔高度*/ + CoordMultiple: 1, + + /** 偏移时间*/ + TranslationTime: 0, + + /** 将后台数据解析成图表*/ + convertDataToModels(tripList, stations, kmRangeCoordMap, lineStyle) { + var models = []; + /** 按车次遍历数据*/ + if (tripList && tripList.length) { + tripList.forEach(trip => { + const opt = { + name: `run-${trip.tripNo}`, + type: 'line', + legendHoverLink: false, + symbolSize: 6, + lineStyle: { + color: '#000', + width: 1, + }, + markPoint: { data: [] }, + data: [] + }; + + // const length = trip.stationTimeList.length; + // if (trip.tripNo && + // trip.stationTimeList.length) { + // opt.markPoint.data.push(createMartPointReverse({ + // name: `${trip.tripNo}`, + // color: '#000' || lineStyle.color, + // coord: [ + // trip.stationTimeList[0].arrivalTime, + // this.getCoordYByElem(stations, kmRangeCoordMap, trip.stationTimeList[0]) + // ] + // })); + // } + + /** 计算停站点坐标集合*/ + trip.stationTimeList.forEach((elem,idx) => { + if (elem.arrivalTime) { + opt.data.push([elem.arrivalTime, this.getCoordYByElem(stations, kmRangeCoordMap, elem), elem.stationCode, trip.tripNo]); + } + + if (elem.departureTime) { + opt.data.push([elem.departureTime, this.getCoordYByElem(stations, kmRangeCoordMap, elem), elem.stationCode, trip.tripNo]); + } + }); + + models.push(opt); + }); + } + + return models; +}, + + /** 更新数据并解析成图表*/ + updateDataToModels(tripList, stations, kmRangeCoordMap, runPlanData, series, lineStyle) { + if (tripList && tripList.length) { + } + return series; + }, + + /** 初始化Y轴*/ + initializeYaxis(stations) { + return createMarkLineModels(stations, (elem) => { + return this.EdgeHeight + elem.kmRange * this.CoordMultiple; + }); + }, + + /** 将后台数据转换为试图序列模型*/ + convertStationsToMap(stations) { + var map = {}; + if (stations && stations.length) { + stations.forEach((elem) => { + map[`${elem.kmRange}`] = this.EdgeHeight + elem.kmRange * this.CoordMultiple; + }); + } + + return map; + }, + + /** 计算y轴最小值*/ + computedYaxisMinValue(stations) { + return stations[0].kmRange * this.CoordMultiple; + }, + + /** 计算y轴最大值*/ + computedYaxisMaxValue(stations) { + return stations[stations.length - 1].kmRange * this.CoordMultiple + this.EdgeHeight * 2; + }, + + /** 格式化y轴数据*/ + computedFormatYAxis(stations, params) { + var yText = '0m'; + + stations.forEach(elem => { + if (elem.kmRange < parseInt(params.value) / this.CoordMultiple - this.EdgeHeight) { + yText = Math.floor(elem.kmRange) + 'm'; + } + }); + + return yText; + }, + + /** 根据是否和上一个车次是否相交,计算下一个车次的折返的高度*/ + computedReentryNumber(code) { + // return parseInt(code || 1) % 2 ? 1 : 2; + return 1; + }, + + /** 根据方向计算y折返偏移量*/ + getYvalueByDirectionCode(defaultVlue, directionCode, num) { + if (directionCode === '1') { + defaultVlue += this.EdgeHeight / 2 * num; + } else if (directionCode === '2') { + defaultVlue -= this.EdgeHeight / 2 * num; + } + + return defaultVlue; + }, + + /** 根据elem计算y值*/ + getCoordYByElem(stations, kmRangeCoordMap, elem) { + var defaultVlue = 0; + var station = stations.find(it => { return it.code == elem.stationCode; }); + if (station) { + defaultVlue = kmRangeCoordMap[`${station.kmRange}`]; + } + + return defaultVlue; + } +}; diff --git a/src/jmapNew/theme/aus_00/planConvert.js b/src/jmapNew/theme/aus_00/planConvert.js index 6e6ecdc31..686a10a81 100644 --- a/src/jmapNew/theme/aus_00/planConvert.js +++ b/src/jmapNew/theme/aus_00/planConvert.js @@ -1,14 +1,14 @@ -import { createMartPointReverse, createSeriesModel, createMarkLineModels, hexColor, convertSheetToList, prefixTime } from '@/utils/runPlan'; +import { createMartPoint, createSeriesModel, createMarkLineModels, hexColor, prefixTime, convertSheetToList } from '@/utils/runPlan'; export default { /** 边缘高度*/ - EdgeHeight: 600, + EdgeHeight: 3, /** 间隔高度*/ - CoordMultiple: 1, + CoordMultiple: 3, /** 偏移时间*/ - TranslationTime: 0, + TranslationTime: 0, /** 将后台数据解析成图表*/ convertDataToModels(tripList, stations, kmRangeCoordMap, lineStyle) { @@ -16,20 +16,18 @@ export default { /** 按车次遍历数据*/ if (tripList && tripList.length) { tripList.forEach(trip => { - const opt = { name: `run-${trip.tripNo}`, type: 'line', showAllSymbol:true, symbolKeepAspect: false, symbolSize: 6, markPoint: { data: [] }, data: []}; - - // const length = trip.stationTimeList.length; - // if (trip.tripNo && - // trip.stationTimeList.length) { - // opt.markPoint.data.push(createMartPointReverse({ - // name: `${trip.tripNo}`, - // color: '#000' || lineStyle.color, - // coord: [ - // trip.stationTimeList[0].arrivalTime, - // this.getCoordYByElem(stations, kmRangeCoordMap, trip.stationTimeList[0]) - // ] - // })); - // } + const opt = { + name: `run-${trip.tripNo}`, + type: 'line', + legendHoverLink: false, + symbolSize: 6, + lineStyle: { + color: '#000', + width: 1, + }, + markPoint: { data: [] }, + data: [] + }; /** 计算停站点坐标集合*/ trip.stationTimeList.forEach((elem,idx) => { @@ -47,7 +45,7 @@ export default { } return models; -}, + }, /** 更新数据并解析成图表*/ updateDataToModels(tripList, stations, kmRangeCoordMap, runPlanData, series, lineStyle) { @@ -56,71 +54,64 @@ export default { return series; }, - /** 初始化Y轴*/ - initializeYaxis(stations) { - return createMarkLineModels(stations, (elem) => { - return this.EdgeHeight + elem.kmRange * this.CoordMultiple; - }); - }, - /** 将后台数据转换为试图序列模型*/ convertStationsToMap(stations) { var map = {}; if (stations && stations.length) { - stations.forEach((elem) => { - map[`${elem.kmRange}`] = this.EdgeHeight + elem.kmRange * this.CoordMultiple; + stations.forEach((elem, index) => { + map[`${elem.kmRange}`] = this.EdgeHeight + index * this.CoordMultiple; }); } return map; }, + /** 初始化Y轴*/ + initializeYaxis(stations) { + return createMarkLineModels(stations, (elem, index) => { + return this.EdgeHeight + index * this.CoordMultiple; + }); + }, /** 计算y轴最小值*/ - computedYaxisMinValue(stations) { - return stations[0].kmRange * this.CoordMultiple; + computedYaxisMinValue() { + return 0; }, /** 计算y轴最大值*/ computedYaxisMaxValue(stations) { - return stations[stations.length - 1].kmRange * this.CoordMultiple + this.EdgeHeight * 2; + return this.EdgeHeight * 2 + (stations.length - 1) * this.CoordMultiple; }, /** 格式化y轴数据*/ computedFormatYAxis(stations, params) { var yText = '0m'; - - stations.forEach(elem => { - if (elem.kmRange < parseInt(params.value) / this.CoordMultiple - this.EdgeHeight) { - yText = Math.floor(elem.kmRange) + 'm'; - } - }); - + var index = Math.floor((parseInt(params.value) - this.EdgeHeight) / this.CoordMultiple); + if (index >= 0 && index < stations.length) { + yText = Math.floor(stations[index].kmRange) + 'm'; + } return yText; }, - /** 根据是否和上一个车次是否相交,计算下一个车次的折返的高度*/ - computedReentryNumber(code) { - // return parseInt(code || 1) % 2 ? 1 : 2; - return 1; - }, - /** 根据方向计算y折返偏移量*/ - getYvalueByDirectionCode(defaultVlue, directionCode, num) { + getYvalueByDirectionCode(defaultVlue, directionCode) { if (directionCode === '1') { - defaultVlue += this.EdgeHeight / 2 * num; + defaultVlue -= this.EdgeHeight / 2; } else if (directionCode === '2') { - defaultVlue -= this.EdgeHeight / 2 * num; + defaultVlue += this.EdgeHeight / 2; } return defaultVlue; }, /** 根据elem计算y值*/ - getCoordYByElem(stations, kmRangeCoordMap, elem) { + getCoordYByElem(stations, kmRangeCoordMap, elem, directionCode, isSpecial) { var defaultVlue = 0; var station = stations.find(it => { return it.code == elem.stationCode; }); if (station) { defaultVlue = kmRangeCoordMap[`${station.kmRange}`]; + if (isSpecial) { + defaultVlue = this.getYvalueByDirectionCode(defaultVlue, directionCode); + } } return defaultVlue; diff --git a/src/permission.js b/src/permission.js index bcfd570a5..f385ac5fa 100644 --- a/src/permission.js +++ b/src/permission.js @@ -14,7 +14,7 @@ import localStore from 'storejs'; // return roles.some(role => permissionRoles.indexOf(role) >= 0); // } -const whiteList = ['/login', '/design/login', '/gzzbxy/relay']; // 不重定向白名单 +const whiteList = ['/login', '/design/login', '/gzzbxy/relay', '/AUStool']; // 不重定向白名单 // const designPageRegex = [/^\/design/, /^\/scriptDisplay/, /^\/publish/, /^\/orderauthor/, /^\/system/, /^\/iscs/, /^\/display\/record/, /^\/display\/manage/, /^\/apply/, /^\/plan/, /^\/display\/plan/, /^\/displayNew\/record/, /^\/displayNew\/manage/, /^\/displayNew\/plan/, /^\/practiceDisplayNew/, /^\/bigSplitScreen/]; diff --git a/src/router/index_Common.js b/src/router/index_Common.js index 6c6d49a7f..f51fea47c 100644 --- a/src/router/index_Common.js +++ b/src/router/index_Common.js @@ -147,6 +147,7 @@ const JsxtApply = () => import('@/views/jsxt/apply/index'); const RefereeList = () => import('@/views/jsxt/refereeList/index'); const RefereeDisplay = () => import('@/views/jsxt/refereeList/display'); const Approval = () => import('@/views/approval/index'); +const CompanyManage = () => import('@/views/system/companyManage/index'); import { GenerateRouteProjectList } from '@/scripts/ProjectConfig'; // import { getSessionStorage } from '@/utils/auth'; @@ -217,6 +218,11 @@ export const constantRoutes = [ path: '/design/jlmap3d/assetmanager', component: Jlmap3dAssetManager, hidden: true + }, + { // 运行图编辑 + path: '/AUStool', + component: PlanMonitorEditAUSTool, + hidden: true }, { path: '/jlmap3d/sandbox', @@ -371,16 +377,11 @@ export const publicAsyncRoute = [ component: PlanMonitorEditUserTool, hidden: true }, - { // 运行图编辑 - path: '/plan/AUStool', - component: PlanMonitorEditAUSTool, - hidden: true - }, { // 运行图编辑 path: '/plan/tool', component: PlanMonitorEditTool, hidden: true - }, + }, { path: '/displayIscs/system', component: IscsSystem, @@ -796,6 +797,15 @@ export const asyncRouter = [ i18n: 'router.userManage' } }, + { + // 单位管理 + path: 'companyManage', + hidden: true, + component: CompanyManage, + meta: { + i18n: 'router.companyManage' + } + }, { // 缓存管理 path: 'cache', @@ -948,8 +958,8 @@ export const asyncRouter = [ }, children: [ { - path:'design', - redirect: '/iscs/design/edit', + path:'design', + redirect: '/iscs/design/edit', component: IscsDesign, meta: { i18n: 'router.iscsDraw', @@ -962,8 +972,8 @@ export const asyncRouter = [ hidden: true } ] - }, - { + }, + { path: 'system', component: IscsSystem, meta: { diff --git a/src/views/newMap/chatView/chatContent.vue b/src/views/newMap/chatView/chatContent.vue index 7a904971d..92151015e 100644 --- a/src/views/newMap/chatView/chatContent.vue +++ b/src/views/newMap/chatView/chatContent.vue @@ -10,7 +10,7 @@
- playicon1 +
diff --git a/src/views/newMap/displayNew/dispatherContest/index.vue b/src/views/newMap/displayNew/dispatherContest/index.vue index a75e1b8df..da24e692f 100644 --- a/src/views/newMap/displayNew/dispatherContest/index.vue +++ b/src/views/newMap/displayNew/dispatherContest/index.vue @@ -75,6 +75,8 @@ + + @@ -106,6 +108,7 @@ import { launchFullscreen } from '@/utils/screen'; import { EventBus } from '@/scripts/event-bus'; import { createSimulationNew } from '@/api/simulation'; import OperationalStatistic from './operationalStatistic.vue'; +import TestResult from './testResult.vue'; import Vue from 'vue'; export default { @@ -119,6 +122,7 @@ export default { TheoryExamSelect, TheoryExam, OperationalStatistic, + TestResult, // TheoryQuiz, // ThroryResult, SelectRole @@ -166,6 +170,7 @@ export default { scriptMode: ScriptMode.TEACH, mapLocation:{}, playerList:[], + actionList:[], currentPlayList:[], // formatUsedTime:'', formatScore:0, @@ -449,11 +454,12 @@ export default { // this.$refs.menuScript.initLoadPage(); // } }, - selectScript({playerList, mapLocation}) { + selectScript({playerList, mapLocation, actionList}) { this.changeScriptMode(this.scriptMode); this.isScriptLoad = true; this.playerList = playerList; this.mapLocation = mapLocation; + this.actionList = actionList; this.userRole = 'AUDIENCE'; this.$store.dispatch('training/setRoles', 'AUDIENCE'); }, @@ -463,15 +469,21 @@ export default { (this.$store.state.training.memberData[role.id] || {}).disabled = true; this.runScriptMode(memberId); }, - finishTraining() { + finishTraining(data) { this.isScriptRun = false; + this.showResultData(data); + }, + showResultData(data) { + this.$refs.testResult.doShow({data:data, actionList:this.actionList}); }, endTraining() { competitionPracticalSceneFinish(this.group, {operationStatisticVO:{}}).then(res=>{ this.isScriptRun = false; // if (this.scriptMode == ScriptMode.TEST) { - this.formatScore = res.data; - this.$messageBox('得分:' + this.formatScore); + // this.formatScore = res.data; + // this. + this.showResultData(res.data); + // this.$messageBox('得分:' + this.formatScore); // } // this.userRole = 'AUDIENCE'; // this.$store.dispatch('training/setRoles', 'AUDIENCE'); diff --git a/src/views/newMap/displayNew/dispatherContest/operationalStatistic.vue b/src/views/newMap/displayNew/dispatherContest/operationalStatistic.vue index 1e41eb191..942abc0d4 100644 --- a/src/views/newMap/displayNew/dispatherContest/operationalStatistic.vue +++ b/src/views/newMap/displayNew/dispatherContest/operationalStatistic.vue @@ -78,9 +78,9 @@ export default { } else { competitionPracticalSceneFinish(this.$route.query.group, this.resultData).then(res=>{ this.$message.success('运营统计数据提交成功'); - this.formatScore = res.data; - this.$messageBox('得分:' + this.formatScore); - this.$emit('finishTraining'); + // this.formatScore = res.data; + // this.$messageBox('得分:' + this.formatScore); + this.$emit('finishTraining', res.data); this.$store.dispatch('scriptRecord/updateOperationalItemVOs', this.resultData.itemVOS); this.dialogShow = false; }).catch(error=>{ diff --git a/src/views/newMap/displayNew/dispatherContest/sceneList.vue b/src/views/newMap/displayNew/dispatherContest/sceneList.vue index ca01dc10f..cb195b5ca 100644 --- a/src/views/newMap/displayNew/dispatherContest/sceneList.vue +++ b/src/views/newMap/displayNew/dispatherContest/sceneList.vue @@ -120,6 +120,7 @@ export default { const playerList = []; EventBus.$emit('clearRunSeries'); EventBus.$emit('loadScene'); + const actionList = {}; if (res.data.memberList && res.data.memberList.length > 0) { this.form.type = ''; res.data.memberList.sort((a, b) => { @@ -128,6 +129,7 @@ export default { this.$store.dispatch('training/setMemberList', {memberList:res.data.memberList, userId:this.$store.state.user.id}); const activeMemberList = []; res.data.actionList.forEach((activeMember)=>{ + actionList[activeMember.id] = activeMember; if (!(activeMemberList.length > 0 && activeMemberList.includes(activeMember.memberId))) { activeMemberList.push(activeMember.memberId); } @@ -177,14 +179,14 @@ export default { if (res.data.mapLocation) { this.mapLocation = res.data.mapLocation; } - this.confirm(playerList); + this.confirm(playerList, actionList); } } }, - confirm(playerList) { + confirm(playerList, actionList) { // this.$store.dispatch('training/setScriptOperationType', this.operationType); // operationType:ScriptMode[this.operationType] - this.$emit('selectScript', {playerList:playerList, mapLocation:this.mapLocation}); + this.$emit('selectScript', {playerList:playerList, mapLocation:this.mapLocation, actionList:actionList}); this.doClose(); }, objectSpanMethod({ row, column, rowIndex, columnIndex }) { diff --git a/src/views/newMap/displayNew/dispatherContest/testResult.vue b/src/views/newMap/displayNew/dispatherContest/testResult.vue new file mode 100644 index 000000000..a3772e257 --- /dev/null +++ b/src/views/newMap/displayNew/dispatherContest/testResult.vue @@ -0,0 +1,268 @@ + + + + + diff --git a/src/views/planMonitor/editToolAUS/monitor.js b/src/views/planMonitor/editToolAUS/monitor.js index faf35a86b..967c448f4 100644 --- a/src/views/planMonitor/editToolAUS/monitor.js +++ b/src/views/planMonitor/editToolAUS/monitor.js @@ -23,29 +23,51 @@ export default { this.listenersOff(); }, methods: { + getStationByCoord1(stations, y) { + for(var i = stations.length-1; i >= 0; i--) { + const station = stations[i]; + const edge = this.planConvert.EdgeHeight + const preKm = i == 0? edge*2: Math.abs(station.kmRange-stations[i-1].kmRange)/2; + const nxtKm = i == stations.length-1? edge: Math.abs(station.kmRange-stations[i+1].kmRange)/2; + const min = edge + station.kmRange - preKm; + const max = edge + station.kmRange + nxtKm; + if (y >= min && y <= max) { + return station; + } + } + return null; + }, getStationByCoord(stations, y) { for(var i = stations.length-1; i >= 0; i--) { const station = stations[i]; - if (station.kmRange <= y) { + const edge = this.planConvert.EdgeHeight; + const rate = this.planConvert.CoordMultiple; + + const preKm = i == 0? edge*2: rate/2; + const nxtKm = i == stations.length-1? edge: rate/2; + const min = edge + i*rate - preKm; + const max = edge + i*rate + nxtKm; + + if (y >= min && y <= max) { return station; } } return null; }, pixelExecCb(e, cb) { - let myChart = this.myChart; - let pointInPixel= [e.offsetX, e.offsetY]; + const event = e.componentType ? e.event: e; + const myChart = this.myChart; + const pointInPixel = [event.offsetX, event.offsetY] if (myChart.containPixel('grid', pointInPixel) && this.planConvert) { - let pointInGrid = myChart.convertFromPixel({seriesIndex:0},pointInPixel); - let xIndex = pointInGrid[0]; - let yIndex = pointInGrid[1]; - let op = myChart.getOption(); - let minY = op.yAxis[0].min; - let xVal = op.xAxis[0].data[xIndex]; - let edgeOffset = this.planConvert.EdgeHeight/6; - let yObj = this.getStationByCoord(this.stations, yIndex-minY-edgeOffset); + const pointInGrid = myChart.convertFromPixel({seriesIndex:0},pointInPixel); + const xIndex = pointInGrid[0]; + const yIndex = pointInGrid[1]; + const option = myChart.getOption(); + const minY = option.yAxis[0].min; + const xVal = option.xAxis[0].data[xIndex]; + const yObj = this.getStationByCoord(this.stations, yIndex-minY); if (yObj && cb) { - cb(yObj, xVal, pointInPixel); + cb({yObj, xVal, pointInPixel, e}); } } }, @@ -54,9 +76,10 @@ export default { const zr = this.myChart.getZr(); zr.on('click', this.onClick, this) - this.myChart.on('contextmenu', this.onContextMenu); this.myChart.on('mousedown', this.onMouseDown); - this.myChart.on('datazoom', this.onUpdateZoom); + this.myChart.on('mouseover', this.onMouseOver); + this.myChart.on('mouseup', this.onMouseUP); + this.myChart.on('datazoom', this.onUpdatePosition); window.addEventListener('resize', this.onUpdatePosition); } }, @@ -65,100 +88,153 @@ export default { const zr = this.myChart.getZr(); zr.off('click', this.onClick); - this.myChart.off('contextmenu', this.onContextMenu) this.myChart.off('mousedown', this.onMouseDown); - this.myChart.off('datazoom', this.onUpdateZoom); + this.myChart.off('mouseover', this.onMouseOver); + this.myChart.off('mouseup', this.onMouseUP); + this.myChart.off('datazoom', this.onUpdatePosition); window.removeEventListener('resize', this.onUpdatePosition); } }, - loadInitGraphic() { - const option = this.myChart.getOption(); - const graphic = option.series.map((el,i) => { - return { - id: el.name, - elements: echarts.util.map(el.data||[], (el, dataIndex) => { - return { - type: 'circle', - position: this.myChart.convertToPixel('grid', el), - shape: { - cx: 0, - cy: 0, - r: 10 - }, - invisible: true, - draggable: true, - ondrag: echarts.util.curry(this.onPointDragging, dataIndex), - onmousemove: echarts.util.curry(this.onShowTooltip, dataIndex), - onmouseout: echarts.util.curry(this.onHideTooltip, dataIndex), - z: 100 - }; - }) - } - }) - graphic.push({ id: 'operate', elements: [] }) - this.myChart.setOption({ graphic }); - }, - onPointDragging(dataIndex, dx, dy) { - // - }, - onShowTooltip(dataIndex) { - this.myChart.dispatchAction({ - type: 'showTip', - seriesIndex: 0, - dataIndex: dataIndex - }); - }, - onHideTooltip(dataIndex) { - this.myChart.dispatchAction({type: 'hideTip'}); - }, onUpdatePosition(e) { const option = this.myChart.getOption(); - const shapes = option.graphic; - // const graphic = shapes.map(el => { - // return echarts.util.map(el.elements||[], function (item, dataIndex) { - // console.log(item, this.myChart.convertToPixel('grid', item.point)) - // return { - // position: this.myChart.convertToPixel('grid', item.point) - // }; - // }) - // }) - // this.myChart.setOption({graphic}); - }, - onUpdateZoom(e) {; - const option = this.myChart.getOption(); - const shapes = option.graphic; - - // const graphic = shapes.map(el => { - // console.log(el) - // const points = (el.elements||[]).map(el => { return el.point; }); - // return echarts.util.map(points, function (point, dataIndex) { - // console.log(point, this.myChart.convertToPixel('grid', point)) - // return { - // position: this.myChart.convertToPixel('grid', point) - // }; - // }) - // }) - // this.myChart.setOption({graphic}); + const elements = option.graphic[0].elements + const graphic = echarts.util.map(elements, (item) => { + return { position: this.myChart.convertToPixel('grid', item.data) }; + }) + this.myChart.setOption({graphic}); }, onClick(e) { switch(this.action) { case 'Plan': - this.pixelExecCb(e, this.handleMarkPoint); + this.pixelExecCb(e, this.handleCreateMark); + break; + } + }, + onMouseDown(e) { + switch(this.action) { + case 'Edit': + this.pixelExecCb(e, this.handlePopDialog); + break; + } + }, + onMouseOver(e) { + this.pixelExecCb(e, this.handleSetLineLight); + }, + onMouseUP(e) { + switch(this.action) { + case 'Translate': + if (this.dragging) { + this.dragging = false; + this.handleTranslate(this.createModel) + } break; } }, - onContextMenu(e) { - const event = e.event; - const point = { - x: event.clientX, - y: event.clientY + onShapePointDragging(e) { + if (this.selected) { + this.dragging = true; + this.pixelExecCb(e, this.handleDragging); } - + }, + setLineLight() { + if (this.selected) { + this.myChart.setOption({ + series: { + name: this.selected.seriesName, + symbolSize: 10, + showAllSymbol: true, + lineStyle: { + width: 2, + color: 'red' + } + } + }); + } + }, + setLineReset() { + if (this.selected) { + this.myChart.setOption({ + series: { + name: this.selected.seriesName, + symbolSize: 6, + showAllSymbol: 'auto', + lineStyle: { + width: 1, + color: '#000' + } + } + }); + } + }, + clearGraphic(labels) { + const option = this.myChart.getOption(); + const elements = option.graphic[0].elements; + option.graphic[0].elements = elements.filter(el => { return !labels.includes(el.subType)}); + this.myChart.setOption(option, {notMerge: true}); + }, + createDragGraphicObj(point) { + return { + type: 'circle', + subType: 'drag', + position: this.myChart.convertToPixel('grid', point), + data: [...point], + shape: { + cx: 0, + cy: 0, + r: 10 + }, + style: { + fill: 'rgba(0,0,0,0.0)' + }, + draggable: 'horizontal', + ondrag: echarts.util.curry(this.onShapePointDragging), + z: 100 + } + }, + createMarkPointObj(point) { + return { + type: 'group', + subType: 'mark', + z: 100, + position: point, + point, + children: [ + { + type: 'circle', + z: 100, + shape: { + cx: 0, + cy: 0, + r: 5 + }, + style: { + fill: 'rgba(0,0,0,0.3)' + } + }, + { + type: 'circle', + z: 100, + shape: { + cx: 0, + cy: 0, + r: 10 + }, + style: { + fill: 'rgba(0,0,0,0.3)' + } + } + ] + } + }, + handlePopDialog({e, pointInPixel}) { if (e.componentType == "series" && e.componentSubType == "line" && e.seriesName.includes('run-')) { - const value = e.value; + const point = { + x: pointInPixel[0], + y: pointInPixel[1] + } const option = this.myChart.getOption(); const dataList = option.series[e.seriesIndex].data; const length = dataList.length; @@ -166,10 +242,15 @@ export default { const pre = dataList[e.dataIndex-1]; this.selected = { + seriesIndex: e.seriesIndex, + seriesName: e.seriesName, seriesId: e.seriesName.replace('run-', ''), depTime: e.dataIndex < length - 1? nxt[0] - value[0]: 0, runTime: e.dataIndex < length - 1? nxt[0] - value[0]: 0, - stationCode: value[2] + stationCode: value[2], + _x: value[0], + dx: 0, + time: 0 } if (e.dataIndex == length - 1 || @@ -181,11 +262,10 @@ export default { } } }, - onMouseDown(e) { + handleSetLineLight({e}) { if (e.componentType == "series" && e.componentSubType == "line" && e.seriesName.includes('run-')) { - const value = e.value; const option = this.myChart.getOption(); const dataList = option.series[e.seriesIndex].data; @@ -193,91 +273,79 @@ export default { const nxt = dataList[e.dataIndex+1]; const pre = dataList[e.dataIndex-1]; + if (this.selected && + this.selected.seriesName != e.seriesName) { + this.setLineReset(); + } + this.selected = { + seriesIndex: e.seriesIndex, + seriesName: e.seriesName, seriesId: e.seriesName.replace('run-', ''), depTime: e.dataIndex < length - 1? nxt[0] - value[0]: 0, runTime: e.dataIndex < length - 1? nxt[0] - value[0]: 0, - stationCode: value[2] + stationCode: value[2], + _x: value[0], + dx: 0, + time: 0 } - this.dragging = true; + this.setLineLight(); + + switch(this.action) { + case 'Translate': + this.handleCreateDrag({e}) + break; + } } }, - clearMarks() { + handleCreateDrag({e}) { const option = this.myChart.getOption(); - const graphic = option.graphic; - const index = graphic.findIndex(el => { return el.id == 'operate'}); - if (index >= 0) { - graphic[index].elements = []; - } + const filters = option.graphic[0].elements.filter(el => { return el.subType != 'drag'}); + + filters.push(this.createDragGraphicObj(e.value)) + option.graphic[0].elements = filters; + this.myChart.setOption(option, {notMerge: true}); }, - createMarkPoint(point, text) { - return { - type: 'circle', - z: 100, - position: point, - point, - shape: { - cx: 0, - cy: 0, - r: 10 - }, - style: { - fill: 'rgba(0,0,0,0.3)' - } + handleCreateMark({pointInPixel, yObj, xVal}) { + const myChart = this.myChart; + const option = this.myChart.getOption(); + const graphic = option.graphic; + const elements = graphic[0].elements; + + elements.push(this.createMarkPointObj(pointInPixel)) + + myChart.setOption(option, {notMerge: true}); + + const filters = elements.filter(el => { return el.subType == 'mark'}); + + if (filters.length == 1) { + this.createModel.startStationCode = yObj.code; + this.createModel.startTime = timeFormat(xVal); + } else if (filters.length >= 2) { + this.createModel.endStationCode = yObj.code; + this.handleCreate(this.createModel); + } + }, + handleDragging({e, xVal}) { + this.selected.dx = xVal - this.selected._x; + this.selected.time += this.selected.dx; + this.selected._x = xVal; + + const option = this.myChart.getOption(); + const model = option.series[this.selected.seriesIndex] + if (model) { + model.data.forEach(el => { + el[0] += this.selected.dx; + }); } - // return { - // type: 'group', - // z: 100, - // position: point, - // point, - // children: [ - // { - // type: 'circle', - // z: 100, - // shape: { - // cx: 0, - // cy: 0, - // r: 5 - // }, - // style: { - // fill: 'rgba(0,0,0,0.3)' - // } - // }, - // { - // type: 'circle', - // z: 100, - // shape: { - // cx: 0, - // cy: 0, - // r: 10 - // }, - // style: { - // fill: 'rgba(0,0,0,0.3)' - // } - // } - // ] - // } - }, - handleMarkPoint(yObj, xVal, pointInPixel) { - let myChart = this.myChart; - if (myChart) { - let op = myChart.getOption(); - let graphic = op.graphic[0]; - if (graphic) { - graphic.elements.push(this.createMarkPoint(pointInPixel, 'hello world')) - myChart.setOption(op); - if (graphic.elements.length == 1) { - this.createModel.startStationCode = yObj.code; - this.createModel.startTime = timeFormat(xVal); - } else if (graphic.elements.length >= 2) { - this.createModel.endStationCode = yObj.code; - this.handleCreate(this.createModel); - } - } + if (e.target && e.target.position) { + e.target.data.x += this.selected.dx; } + + this.myChart.setOption(option, {notMerge: true}); } } } diff --git a/src/views/planMonitor/editToolAUS/schedule.vue b/src/views/planMonitor/editToolAUS/schedule.vue index e59d991a9..72591661d 100644 --- a/src/views/planMonitor/editToolAUS/schedule.vue +++ b/src/views/planMonitor/editToolAUS/schedule.vue @@ -3,12 +3,12 @@