From cf9d04b97ef0b8abb63e587e0898e301765ed4b9 Mon Sep 17 00:00:00 2001
From: cuilei <ray_tsu1@163.com>
Date: 星期一, 18 八月 2025 17:07:30 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
src/views/mdc/base/modules/DeviceLog/WorkChartModel.vue | 592 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 592 insertions(+), 0 deletions(-)
diff --git a/src/views/mdc/base/modules/DeviceLog/WorkChartModel.vue b/src/views/mdc/base/modules/DeviceLog/WorkChartModel.vue
new file mode 100644
index 0000000..9779f63
--- /dev/null
+++ b/src/views/mdc/base/modules/DeviceLog/WorkChartModel.vue
@@ -0,0 +1,592 @@
+<template>
+ <div ref="workChart">
+ <a-modal :title="title" :getContainer="() => this.$refs.workChart" width="80%" wrap-class-name="full-modal"
+ :footer="null" :visible="visible"
+ @cancel="handleCancel" cancelText="鍏抽棴">
+ <div>
+ <div>
+ <a-row :gutter="24">
+ <a-col :span="6">
+ <a-form-item label="璁惧缂栧彿" :labelCol="labelCol" :wrapperCol="wrapperCol">
+ <a-input placeholder="杈撳叆璁惧缂栧彿鏌ヨ" :readOnly="readOnly" v-model="queryParams.equipmentId"></a-input>
+ </a-form-item>
+ </a-col>
+ <a-col :span="6">
+ <a-form-item label="鏃ユ湡" :labelCol="labelCol" :wrapperCol="wrapperCol">
+ <a-date-picker v-model="queryParams.paramDate" :disabledDate="disabledDate" format='YYYY-MM-DD'/>
+ </a-form-item>
+ </a-col>
+ <a-col :span="6">
+ <a-form-item label="閲囨牱鍛ㄦ湡" :labelCol="labelCol" :wrapperCol="wrapperCol">
+ <a-input-number v-model="queryParams.period" :min="100"/>
+ </a-form-item>
+ </a-col>
+ </a-row>
+ <a-row :gutter="24">
+ <a-col :span="6">
+ <a-form-item label="瀹夎浣嶇疆" :labelCol="labelCol" :wrapperCol="wrapperCol">
+ <a-input placeholder="杈撳叆瀹夎浣嶇疆鏌ヨ" :readOnly="readOnly" v-model="queryParams.equipmentName"></a-input>
+ </a-form-item>
+
+ </a-col>
+ <a-col :span="10">
+ <a-form-item label="鏃堕棿" :labelCol="labelCol" :wrapperCol="wrapperCol">
+ <div class="params_time">
+ <a-time-picker :open="stratOpen" format="HH:mm" @openChange="timeHandleChange('start')"
+ v-model="queryParams.start">
+ <a-button slot="addon" size="small" type="primary" @click="timeHandleClose('start')">
+ 纭畾
+ </a-button>
+ </a-time-picker>
+ <a-time-picker :open="endOpen" format="HH:mm" @openChange="timeHandleChange('end')"
+ v-model="queryParams.end">
+ <a-button slot="addon" size="small" type="primary" @click="timeHandleClose('end')">
+ 纭畾
+ </a-button>
+ </a-time-picker>
+ </div>
+ </a-form-item>
+ </a-col>
+ <a-col :span="4">
+ <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button>
+ </a-col>
+ </a-row>
+
+ </div>
+ <div class="checkboxgroup">
+ <p>缁熻鍙傛暟</p>
+ <div class="checkboxgroup_con">
+ <a-checkbox-group name="checkboxgroup" :value="option" :options="plainOptions" @change="checkboxOnChange"/>
+ </div>
+ </div>
+
+
+ <a-spin :spinning="spinning">
+ <div id="workChart" style="width:85%;height: 500px;"/>
+ </a-spin>
+ </div>
+ </a-modal>
+ </div>
+</template>
+
+<script>
+ import moment from 'moment'
+ import * as echarts from 'echarts'
+ import {
+ getAction,
+ postAction
+ } from '@/api/manage'
+ import {
+ duplicateCheck
+ } from '@/api/api'
+
+ export default {
+ name: 'WorkChartModel',
+ components: {},
+ props: {
+ collectTime: {
+ type: Object
+ },
+ equipment: {
+ type: Object
+ }
+ },
+ watch: {
+ // 鐩戞帶鐖剁粍浠剁偣鍑诲乏鍙崇澶村垏鎹㈢殑鏃堕棿鍊煎皢鍏惰祴缁欑偣鍑诲伐浣滄洸绾垮悗鐨勬椂闂撮�夋嫨鍣ㄧ殑鍊�
+ collectTime: {
+ handler(newVal) {
+ this.currentToggledTime = newVal
+ }
+ }
+ },
+ data() {
+ return {
+ spinning: false,
+ labelCol: {
+ xs: {
+ span: 24
+ },
+ sm: {
+ span: 6
+ }
+ },
+ wrapperCol: {
+ xs: {
+ span: 24
+ },
+ sm: {
+ span: 18
+ }
+ },
+ readOnly: true,
+ title: '',
+ plainOptions: [],
+ option: [],
+ workChart: '',
+ node: {},
+ stratOpen: false,
+ endOpen: false,
+ visible: false,
+ show: false,
+ queryParams: {},
+ panduanResult: [],
+ url: {
+ initPlainOptions: '/mdc/mdcDriveTypeParamConfig/findWorkCurveParamList',
+ workChart: '/mdc/mdcEquipmentRunningSection/workChart'
+ },
+ currentToggledTime: '',
+ isClicklogListRow: false
+ }
+ },
+ created() {
+ this.$bus.$on('tableRowRecord', this.getLogListRowRecord)
+ },
+ mounted() {
+
+ },
+ methods: {
+ disabledDate(current) {
+ //Can not slect days before today and today
+ return current && current > moment().endOf('day')
+ },
+ initPlainOptions(param) {
+ let that = this
+ let equipment = param.equipmentId
+ getAction(this.url.initPlainOptions, { equipmentId: equipment }).then((res) => {
+ if (res.success) {
+ let temp = []
+ // debugger
+ for (var item of res.result) {
+ temp.push({ label: item.chineseName, value: item.id, englishName: item.englishName })
+ }
+ that.plainOptions = temp
+ if (temp.length > 0) {
+ that.option = [temp[0].value]
+ }
+ let param = {
+ driveType: that.node.driveType,
+ equipmentId: that.node.equipmentId,
+ date: that.queryParams.paramDateStr,
+ start: that.queryParams.startStr,
+ end: that.queryParams.endStr,
+ interval: that.queryParams.period,
+ codeTypeId: that.option.join(',')
+ }
+ that.initChart(param)
+ }
+ })
+ },
+ searchQuery() {
+ this.queryParams.paramDateStr = this.queryParams.paramDate.format('yyyy-MM-DD')
+ this.queryParams.startStr = this.queryParams.start.format('HH:mm')
+ this.queryParams.endStr = this.queryParams.end.format('HH:mm')
+ let param = {
+ driveType: this.node.driveType, equipmentId: this.node.equipmentId,
+ date: this.queryParams.paramDateStr, start: this.queryParams.startStr,
+ end: this.queryParams.endStr, interval: this.queryParams.period,
+ codeTypeId: this.option.join(',')
+ }
+ this.initChart(param)
+ this.spinning = true
+ },
+ timeHandleChange(val) {
+ if (val == 'start') {
+ this.stratOpen = true
+ } else {
+ this.endOpen = true
+ }
+ },
+ timeHandleClose(val) {
+ if (val == 'start') {
+ this.stratOpen = false
+ this.endOpen = true
+ } else {
+ this.endOpen = false
+ }
+ },
+ add(node) {
+ let _this = this
+ this.visible = true
+ this.node = node
+ this.spinning = true
+ let paramDate
+ let start
+ let end
+ // 褰撴病鏈夊垏鎹㈣繃鏃堕棿currentToggledTime鐨勫�间负绌哄�硷紝濡傛灉鐢变簬鐐瑰嚮宸﹀彸绠ご鍒囨崲杩囨椂闂达紝鍒檆urrentToggledTime涓哄垏鎹㈠悗鐨勬椂闂�
+ if (!this.currentToggledTime) {
+ paramDate = moment()
+ } else {
+ paramDate = this.currentToggledTime
+ }
+ // 鍒ゆ柇鏄惁鐐瑰嚮璁惧鏃ュ織琛ㄦ牸琛岀殑鏁版嵁锛岃嫢鐐瑰嚮琛ㄦ牸鏁版嵁鍒欐樉绀鸿〃鏍兼暟鎹腑鐨勬椂闂达紝鑻ョ偣鍑诲伐浣滄洸绾垮浘鐗囧垯鏄剧ず0鐐硅嚦褰撳墠鏃堕棿鏁版嵁
+ if (this.isClicklogListRow) {
+ start = node.start
+ end = node.end
+ } else {
+ start = moment('0:0', 'HH:mm')
+ end = moment(moment().format('HH:mm'), 'HH:mm')
+ }
+ this.queryParams = {
+ equipmentId: node.equipmentId,
+ equipmentName: node.equipmentName,
+ period: 100,
+ paramDate: paramDate,
+ paramDateStr: paramDate.format('yyyy-MM-DD'),
+ start: start,
+ startStr: start.format('HH:mm'),
+ end: end,
+ endStr: end.format('HH:mm')
+ }
+ this.$nextTick(() => {
+ _this.initPlainOptions(node)
+ })
+ },
+ handleCancel() {
+ this.visible = false
+ this.stratOpen = false
+ this.endOpen = false
+ },
+ checkboxOnChange(e) {
+ if (e.length <= 3) {
+ this.option = e
+ } else {
+ // this.$message.warn('鏈�澶氬彧鑳介�夋嫨3涓�')
+ this.$notification.warning({
+ message: '娑堟伅',
+ description: '鏈�澶氬彧鑳介�夋嫨涓変釜'
+ })
+ return false
+ }
+ },
+ close() {
+ this.visible = false
+ this.show = false
+ },
+ getYAxisOffset(index) {
+ return index * 50 + 10
+ },
+ initChart(param) {
+ if (!this.workChart) {
+ this.workChart = echarts.init(document.getElementById('workChart'))
+ }
+ let option = {
+ tooltip: {
+ trigger: 'axis',
+ position: function(pt) {
+ return [pt[0], '10%']
+ }
+ },
+ legend: {
+ data: []
+ },
+ title: {
+ left: 'center',
+ text: ''
+ },
+ toolbox: {
+ feature: {
+ dataZoom: {
+ yAxisIndex: 'none'
+ },
+ restore: {},
+ saveAsImage: {}
+ }
+ },
+ grid: {
+ left: '8%',
+ top: '10%',
+ right: '2%',
+ bottom: '14%',
+ containLabel: true
+ },
+ xAxis: {
+ type: 'time',
+ boundaryGap: false
+ },
+ yAxis: [
+ {
+ yAxisIndex: 0,
+ type: 'value',
+ offset: 0,
+ position: 'left',
+ boundaryGap: [0, '15%'],
+ axisLine: {
+ show: true,
+ lineStyle:{
+ color:'#5470C6'
+ }
+ }
+ },
+ {
+ yAxisIndex: 1,
+ type: 'value',
+ offset: 60,
+ position: 'left',
+ boundaryGap: [0, '15%'],
+ axisLine: {
+ show: true,
+ lineStyle:{
+ color:'#91CC75'
+ }
+ }
+ },
+ {
+ yAxisIndex: 2,
+ type: 'value',
+ offset: 120,
+ position: 'left',
+ boundaryGap: [0, '15%'],
+ axisLine: {
+ show: true,
+ lineStyle:{
+ color:'#FAC858'
+ }
+ }
+ }
+ ],
+ dataZoom: [
+ {
+ type: 'inside',
+ start: 0,
+ end: 20
+ },
+ {
+ start: 0,
+ end: 20
+ }
+ ],
+ series: [
+ {
+ showSymbol: true,
+ symbolSize: 20,
+ label: 'show',
+ name: '',
+ type: 'line',
+ data: [],
+ smooth: true,
+ symbol: 'none'
+ }
+ ]
+ }
+ let _this = this
+ let temp = []
+ for (let i = 0; i < this.plainOptions.length; i++) {
+ let item = this.plainOptions[i]
+ if (this.option.indexOf(item.value) > -1) {
+ temp.push(item)
+ }
+ }
+ console.log('temp',temp)
+ getAction(this.url.workChart, param).then((res) => {
+ if (JSON.stringify(res.result) == '[]' || res.result == null) {
+ // this.$message.warning('鏃犳暟鎹紒')
+ this.$notification.warning({
+ message: '娑堟伅',
+ description: '鏃犳暟鎹�!'
+ })
+ this.spinning = false
+ _this.workChart.setOption(option, true)
+ } else {
+ this.spinning = false
+ // debugger
+ let result = []
+ let itemLine = []
+ //y杞存暟缁�
+ var Yarr = []
+ var lengenddata = []
+ for (let i = 0; i < temp.length; i++) {
+ let item = temp[i]
+ itemLine = []
+ for (let m = 0; m < res.result.length; m++) {
+ let d = []
+ d.push(res.result[m].collectTime)
+ // debugger
+ d.push(res.result[m][item.englishName])
+ itemLine.push(d)
+ }
+ var lll = {
+ name: item.label
+ }
+ lengenddata.push(lll)
+ var Yline = {
+ name: item.label,
+ type: 'value',
+ yAxisIndex: i,
+ boundaryGap: [0, '100%']
+ }
+ Yarr.push(Yline)
+ var line = {
+ name: item.label,
+ type: 'line',
+ // areaStyle:{},
+ smooth: true,
+ symbol: 'circle',
+ symbolSize: 10,
+ yAxisIndex: i,
+ data: itemLine
+ }
+ result.push(line)
+
+ }
+ console.log('result===========',result)
+ console.log('legend=============',lengenddata)
+ // option.yAxis = Yarr;
+ option.series = result
+ option.legend = lengenddata
+ // console.log(option);
+ _this.workChart.setOption(option, true)
+ window.addEventListener('resize', function() {
+ _this.workChart.resize()
+ })
+ }
+
+ })
+ },
+ /**
+ * 鑾峰彇鐐瑰嚮璁惧鏃ュ織琛ㄦ牸琛屽悗浠庡厔寮熺粍浠朵紶鏉ョ殑鏃堕棿瀵硅薄
+ * @param timeObj 褰撳墠琛岀殑寮�濮嬫椂闂翠笌缁撴潫鏃堕棿缁勬垚鐨勫璞�
+ */
+ getLogListRowRecord(timeObj) {
+ // 鍒ゆ柇鏄惁鐐瑰嚮璁惧鏃ュ織琛ㄦ牸琛岀殑鏁版嵁锛屾鏃朵负鐐瑰嚮琛ㄦ牸鏁版嵁涓簍rue
+ this.isClicklogListRow = true
+ // 鍚堝苟鐖剁粍浠朵紶鏉ョ殑褰撳墠璁惧淇℃伅瀵硅薄涓庡厔寮熺粍浠朵紶鏉ョ殑褰撳墠琛岀殑鏃堕棿瀵硅薄
+ const newQueryParams = Object.assign(this.equipment, timeObj)
+ this.add(newQueryParams)
+ this.title = '宸ヤ綔鏇茬嚎'
+ }
+ }
+ }
+</script>
+
+<style scoped lang="less">
+ .full-modal {
+ .ant-modal {
+ max-width: 100%;
+ top: 0;
+ padding-bottom: 0;
+ margin: 0;
+ }
+ .ant-modal-content {
+ display: flex;
+ flex-direction: column;
+ height: calc(100vh);
+ }
+ .ant-modal-body {
+ flex: 1;
+ }
+ }
+
+ /deep/ .ant-modal {
+ /*background-color: #000;*/
+ /*color: #fff;*/
+ }
+
+ /deep/ .ant-modal-header {
+ /*background-color: #000;*/
+ }
+
+ /deep/ .ant-modal-title {
+ /*color: #fff;*/
+ }
+
+ /deep/ .ant-modal-close {
+ color: #1191b0;
+ font-size: 24px;
+ }
+
+ /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)));*/
+ /*background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
+ /*background: -o-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
+ /*background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
+ /*background: linear-gradient(to right, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
+ /*background-color: #000;*/
+ /*color: #fff;*/
+ position: relative;
+ }
+
+ /deep/ .ant-modal-header {
+ /*border-bottom: none!important;*/
+ }
+
+ /deep/ .ant-checkbox-wrapper {
+ /*color: #fff;*/
+ }
+
+ /deep/ .ant-form-item-label label {
+ /*color: #fff;*/
+ }
+
+ /deep/ .ant-btn {
+ /*position: absolute;*/
+
+ }
+
+ .checkboxgroup {
+ position: absolute;
+ right: 5%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+ }
+
+ /deep/ .ant-checkbox-group {
+ display: flex;
+ flex-direction: column;
+ }
+
+ /deep/ .ant-checkbox-group .ant-checkbox-wrapper {
+ padding: 10px;
+ }
+
+ .con_btn {
+ display: flex;
+ align-items: center;
+ }
+
+ .workChart_params {
+ display: flex;
+ /*align-items: center;*/
+ flex-direction: column;
+ float: left;
+ }
+
+ .workChart_params .params_one {
+ display: flex;
+ justify-content: space-between;
+ }
+
+ .workChart_params .params_two {
+ display: flex;
+ justify-content: space-between;
+ }
+
+ /deep/ .workChart_params .ant-form-item {
+ display: flex;
+ }
+
+ /deep/ .workChart_params .ant-form-item .ant-form-item-control-wrapper {
+ margin: 0 10px;
+ }
+
+ .ant-btn {
+ padding: 0 10px;
+ margin-left: 3px;
+ }
+
+ .ant-form-item-control {
+ line-height: 0px;
+ }
+
+ /** 涓昏〃鍗曡闂磋窛 */
+ .ant-form .ant-form-item {
+ margin-bottom: 10px;
+ }
+
+ /** Tab椤甸潰琛岄棿璺� */
+ .ant-tabs-content .ant-form-item {
+ margin-bottom: 0px;
+ }
+</style>
--
Gitblit v1.9.3