From 30ddfcd5409a9342ef79039eb139c07d80b5719d Mon Sep 17 00:00:00 2001
From: chenzeping <ChenZeping02609@163.com>
Date: 星期四, 15 四月 2021 15:16:57 +0800
Subject: [PATCH] 弹框修改
---
/dev/null | 22 ---
src/components/BaseNav/WasteSolid/PublicTabs.vue | 134 +++++++++++++++++++
src/components/table/summarySheets.vue | 4
src/components/BaseNav/WasteSolid/PublicVideo.vue | 80 +++++++++++
src/components/BaseNav/WasteSolid/PublicTable.vue | 166 +++++++++++++++++++++++
src/components/BaseNav/WasteGas/flueGas.js | 0
src/components/BaseNav/WasteSolid/SolidWaste.js | 0
7 files changed, 383 insertions(+), 23 deletions(-)
diff --git a/src/components/BaseNav/SolidWaste/directive/dir.js b/src/components/BaseNav/SolidWaste/directive/dir.js
deleted file mode 100644
index 063f6c3..0000000
--- a/src/components/BaseNav/SolidWaste/directive/dir.js
+++ /dev/null
@@ -1,38 +0,0 @@
-import Vue from 'vue'
-
-const drag = Vue.directive('drag', {
- bind (el, binding, vnode, oldVnode) {
- const dialogHeaderEl = el.querySelector('.public-bounced-title')
- dialogHeaderEl.onmousedown = function (e) {
- var distX = e.pageX - el.offsetLeft
- var distY = e.pageY - el.offsetTop
- if (e.preventDefault) {
- e.preventDefault()
- } else {
- e.returnValue = false
- }
- document.onmousemove = function (e) {
- let left = e.clientX - distX
- let top = e.clientY - distY
-
- if (left <= 0) {
- left = 5
- } else if (left > document.documentElement.clientWidth - dialogHeaderEl.clientWidth) {
- left = document.documentElement.clientWidth - dialogHeaderEl.clientWidth - 5
- }
- if (top <= 0) {
- top = 5
- } else if (top > document.documentElement.clientHeight - dialogHeaderEl.clientHeight) {
- top = document.documentElement.clientHeight - dialogHeaderEl.clientHeight - 5
- }
-
- el.style.left = left + 'px'
- el.style.top = top + 'px'
- }
- document.onmouseup = function () {
- document.onmousemove = document.onmouseup = null
- }
- }
- }
-})
-export default drag
diff --git a/src/components/BaseNav/SolidWaste/directive/directive.js b/src/components/BaseNav/SolidWaste/directive/directive.js
deleted file mode 100644
index a656af4..0000000
--- a/src/components/BaseNav/SolidWaste/directive/directive.js
+++ /dev/null
@@ -1,77 +0,0 @@
-export default {
- bind (el, binding, vnode) {
- const dialogHeaderEl = el.querySelector('.el-dialog__header')
- const dragDom = el.querySelector('.el-dialog')
- dialogHeaderEl.style.cssText += ';cursor:move;'
- dragDom.style.cssText += ';top:0px;'
-
- // 鑾峰彇鍘熸湁灞炴�� ie dom鍏冪礌.currentStyle 鐏嫄璋锋瓕 window.getComputedStyle(dom鍏冪礌, null);
- const getStyle = (function () {
- if (window.document.currentStyle) {
- return (dom, attr) => dom.currentStyle[attr]
- } else {
- return (dom, attr) => getComputedStyle(dom, false)[attr]
- }
- })()
-
- dialogHeaderEl.onmousedown = (e) => {
- // 榧犳爣鎸変笅锛岃绠楀綋鍓嶅厓绱犺窛绂诲彲瑙嗗尯鐨勮窛绂�
- const disX = e.clientX - dialogHeaderEl.offsetLeft
- const disY = e.clientY - dialogHeaderEl.offsetTop
-
- const dragDomWidth = dragDom.offsetWidth
- const dragDomHeight = dragDom.offsetHeight
-
- const screenWidth = document.body.clientWidth
- const screenHeight = document.body.clientHeight
-
- const minDragDomLeft = dragDom.offsetLeft
- const maxDragDomLeft = screenWidth - dragDom.offsetLeft - dragDomWidth
-
- const minDragDomTop = dragDom.offsetTop
- const maxDragDomTop = screenHeight - dragDom.offsetTop - dragDomHeight
-
- // 鑾峰彇鍒扮殑鍊煎甫px 姝e垯鍖归厤鏇挎崲
- let styL = getStyle(dragDom, 'left')
- let styT = getStyle(dragDom, 'top')
-
- if (styL.includes('%')) {
- styL = +document.body.clientWidth * (+styL.replace(/\%/g, '') / 100)
- styT = +document.body.clientHeight * (+styT.replace(/\%/g, '') / 100)
- } else {
- styL = +styL.replace(/\px/g, '')
- styT = +styT.replace(/\px/g, '')
- }
-
- document.onmousemove = function (e) {
- // 閫氳繃浜嬩欢濮旀墭锛岃绠楃Щ鍔ㄧ殑璺濈
- let left = e.clientX - disX
- let top = e.clientY - disY
-
- // 杈圭晫澶勭悊
- if (-(left) > minDragDomLeft) {
- left = -minDragDomLeft
- } else if (left > maxDragDomLeft) {
- left = maxDragDomLeft
- }
-
- if (-(top) > minDragDomTop) {
- top = -minDragDomTop
- } else if (top > maxDragDomTop) {
- top = maxDragDomTop
- }
-
- // 绉诲姩褰撳墠鍏冪礌
- dragDom.style.cssText += `;left:${left + styL}px;top:${top + styT}px;`
-
- // emit onDrag event
- vnode.child.$emit('dragDialog')
- }
-
- document.onmouseup = function (e) {
- document.onmousemove = null
- document.onmouseup = null
- }
- }
- }
-}
diff --git a/src/components/BaseNav/SolidWaste/directive/index.js b/src/components/BaseNav/SolidWaste/directive/index.js
deleted file mode 100644
index d8a3108..0000000
--- a/src/components/BaseNav/SolidWaste/directive/index.js
+++ /dev/null
@@ -1,14 +0,0 @@
-// import drag from './drag'
-import drag from './directive'
-
-const install = function (Vue) {
- Vue.directive('el-drag-dialog', drag)
-}
-
-if (window.Vue) {
- window['el-drag-dialog'] = drag
- Vue.use(install) // eslint-disable-line
-}
-
-drag.install = install
-export default drag
diff --git a/src/components/BaseNav/flueGas/flueGas.js b/src/components/BaseNav/WasteGas/flueGas.js
similarity index 100%
rename from src/components/BaseNav/flueGas/flueGas.js
rename to src/components/BaseNav/WasteGas/flueGas.js
diff --git a/src/components/BaseNav/WasteSolid/PublicTable.vue b/src/components/BaseNav/WasteSolid/PublicTable.vue
new file mode 100644
index 0000000..1515187
--- /dev/null
+++ b/src/components/BaseNav/WasteSolid/PublicTable.vue
@@ -0,0 +1,166 @@
+<template>
+ <!-- <div class="react">-->
+ <!-- <div class="main-table">-->
+ <!-- <el-table :data="listData" style="width: 100%" height="255px" :row-class-name="tableRowClassName">-->
+ <!-- <el-table-column v-for="(item, index) in listLabel" :key="index" :prop="item.prop"-->
+ <!-- :label="item.label" :show-overflow-tooltip="true"></el-table-column>-->
+ <!-- </el-table>-->
+ <!-- </div>-->
+ <!-- </div>-->
+ <div class="main">
+ <span></span>
+ <span></span>
+ <span></span>
+ <span></span>
+ <div class="main-table">
+ <el-table :data="listData" style="width: 100%" height="325px" :row-class-name="tableRowClassName">
+ <el-table-column v-for="(item, index) in listLabel" :key="index" :prop="item.prop"
+ :label="item.label" :show-overflow-tooltip="true"></el-table-column>
+ </el-table>
+ </div>
+ </div>
+</template>
+
+<script>
+export default {
+ name: 'PublicTable',
+ props: ['displayContentTable'],
+ data () {
+ return {
+ listData: [],
+ listLabel: [
+ {
+ label: '搴忓彿',
+ prop: 'StoragePlaceId'
+ },
+ {
+ label: '绫诲埆',
+ prop: 'StoragePlaceTypeName'
+ },
+ {
+ label: '鍥哄簾鍚嶇О',
+ prop: 'StoragePlaceName'
+ },
+ {
+ label: '浠g爜',
+ prop: 'StorageZDMJ'
+ },
+ {
+ label: '浜х敓閲�(t)',
+ prop: 'StorageZCL'
+ },
+ {
+ label: '璐瓨閲�(t)',
+ prop: 'StorageZCNL'
+ },
+ {
+ label: '浜х敓瑁呯疆',
+ prop: 'StorageType'
+ }
+ ]
+ }
+ },
+ mounted () {
+ this.$nextTick(() => {
+ this.listData.push(this.displayContentTable[0], {}, {}, {}, {}, {}, {})
+ })
+ },
+ methods: {
+ // 闅旇棰滆壊璁剧疆
+ tableRowClassName ({
+ row,
+ rowIndex
+ }) {
+ if (rowIndex % 2 === 0) {
+ return 'warning-row'
+ } else if (rowIndex % 2 === 1) {
+ return 'success-row'
+ }
+ return ''
+ }
+ }
+}
+</script>
+
+<style lang="less" scoped>
+//.react {
+// position: relative;
+// background: rgba(33, 41, 69, 0.9);
+// background: linear-gradient(to left, #02a6b5, #02a6b5) left top no-repeat,
+// linear-gradient(to bottom, #02a6b5, #02a6b5) left top no-repeat,
+// linear-gradient(to left, #02a6b5, #02a6b5) right top no-repeat,
+// linear-gradient(to bottom, #02a6b5, #02a6b5) right top no-repeat,
+// linear-gradient(to left, #02a6b5, #02a6b5) left bottom no-repeat,
+// linear-gradient(to bottom, #02a6b5, #02a6b5) left bottom no-repeat,
+// linear-gradient(to left, #02a6b5, #02a6b5) right bottom no-repeat,
+// linear-gradient(to left, #02a6b5, #02a6b5) right bottom no-repeat;
+// background-size: 2px 20px, 20px 2px, 2px 20px, 20px 2px;
+//
+// .main-table {
+// //border: 1px red solid;
+// }
+//}
+/deep/ .el-table td {
+ border-bottom: none !important;
+}
+
+/deep/ .el-table th.is-leaf {
+ border-bottom: none !important;
+}
+
+/deep/ .el-table td {
+ height: 45px !important;
+ line-height: 45px !important;
+}
+
+/deep/ .el-table tbody tr:hover > td {
+ background: none !important
+}
+
+.main {
+ position: relative;
+ background: rgba(33, 41, 69, 0.9);
+ //border: 1px solid red;
+}
+
+.main span:nth-child(1) {
+ position: absolute;
+ left: -1px;
+ top: -1px;
+ padding: 10px;
+ border-style: solid;
+ border-color: #02a6b5;
+ border-width: 1px 0 0 1px;
+}
+
+.main span:nth-child(2) {
+ position: absolute;
+ right: -1px;
+ top: -1px;
+ padding: 10px;
+ border-style: solid;
+ border-color: #02a6b5;
+ border-width: 1px 1px 0 0;
+}
+
+.main span:nth-child(3) {
+ position: absolute;
+ right: -1px;
+ bottom: -1px;
+ padding: 10px;
+ border-style: solid;
+ border-color: #02a6b5;
+ border-width: 0 1px 1px 0;
+}
+
+.main span:nth-child(4) {
+ position: absolute;
+ left: -1px;
+ bottom: -1px;
+ padding: 10px;
+ border-style: solid;
+ border-color: #02a6b5;
+ border-width: 0 0 1px 1px;
+}
+
+</style>
diff --git a/src/components/BaseNav/WasteSolid/PublicTabs.vue b/src/components/BaseNav/WasteSolid/PublicTabs.vue
new file mode 100644
index 0000000..ba844dd
--- /dev/null
+++ b/src/components/BaseNav/WasteSolid/PublicTabs.vue
@@ -0,0 +1,134 @@
+<template>
+ <!-- 妗� -->
+ <div class="win">
+ <!-- 鍥涗釜瑙掔殑杈规鏁堟灉 -->
+ <div class="border_corner border_corner_left_top"></div>
+ <div class="border_corner border_corner_right_top"></div>
+ <div class="border_corner border_corner_left_bottom"></div>
+ <div class="border_corner border_corner_right_bottom"></div>
+ <div class="main">
+ <div class="main-matter">
+ <div v-if="value === 'feiqi'">
+ <ul>
+ <li>鐩戞祴鐐瑰悕绉�:{{ setWasteGasdata.Name }}</li>
+ <li>鐢熶骇鍗曚綅:{{ setWasteGasdata.porltName }}</li>
+ <li>鎺掓斁绫诲瀷鍚嶇О:{{ setWasteGasdata.MonTypeName }}</li>
+ <li>鎺掓斁鍘诲悜:{{ setWasteGasdata.EmissDirecti }}</li>
+ <li>鎺у埗绾у埆鍚嶇О:{{ setWasteGasdata.ContrLevelShowName }}</li>
+ <li>鍐�/澶栨帓鍙�:{{ setWasteGasdata.OrOutPortName }}</li>
+ </ul>
+ </div>
+ <div v-if="value === 'gufei'">
+ <ul>
+ <li>鍦烘墍鍚嶇О:{{ setSolidWaste.StoragePlaceName }}</li>
+ <li>璐瓨鑳藉姏:{{ setSolidWaste.StorageQty }}(鍚�)</li>
+ <li>鍓╀綑璐瓨鑳藉姏:{{ setSolidWaste.SurplusFloorArea }}(鍚�)</li>
+ <li>鍗犲湴闈㈢Н(銕�):{{ setSolidWaste.DesignFloorArea }}(銕�)</li>
+ <li>鏈�杩戣串瀛樻棩鏈�:{{ setSolidWaste.StorageDate }}</li>
+ <li class="lastli"></li>
+ </ul>
+ </div>
+ <div v-else-if="value === 'feishui'">
+ <ul>
+ <li>鐩戞祴鐐瑰悕绉�:{{ setWasteWaterdata.Name }}</li>
+ <li>鐢熶骇鍗曚綅:{{ setWasteWaterdata.porltName }}</li>
+ <li>鎺掓斁绫诲瀷鍚嶇О:{{ setWasteWaterdata.MonTypeName }}</li>
+ <li>鎺掓斁鍘诲悜:{{ setWasteWaterdata.EmissDirecti }}</li>
+ <li>鎺у埗绾у埆鍚嶇О:{{ setWasteWaterdata.ContrLevelShowName }}</li>
+ <li>鍐�/澶栨帓鍙�:{{ setWasteWaterdata.OrOutPortName }}</li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+export default {
+ name: 'GasTable',
+ props: ['setSolidWaste', 'value', 'setWasteGasdata', 'setWasteWaterdata']
+}
+</script>
+
+<style scoped lang="less">
+
+.win {
+ position: relative;
+ margin-bottom: 0.04rem;
+ background-color: @background-color;
+ //width: 6rem;
+ //height: 0.5rem;
+}
+
+.main {
+ //width: 100%;
+ //height: 100%;
+
+ .main-matter {
+ font-size: 0.06rem;
+ font-weight: normal;
+ padding: 0.04rem 0;
+ border: 1px solid #396d83;
+ ul {
+ //width: 100%;
+ //height: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ flex-wrap: wrap;
+ margin-bottom: -0.04rem;
+ li {
+ margin-bottom: 0.04rem;
+ text-align: center;
+ min-width: 31%;
+ background-color: #243a55;
+ color: #00d0f9;
+ border-radius: 0.02rem;
+ font-size: 0.08rem;
+ line-height: 0.09rem;
+ padding: 0.03rem .5%;
+ }
+ .lastli {
+ visibility: hidden
+ }
+ }
+ }
+}
+
+.border_corner {
+ z-index: 999;
+ position: absolute;
+ width: 10px;
+ height: 10px;
+ background: rgba(0, 0, 0, 0);
+ border: 1px solid #47d5ea;
+}
+
+.border_corner_left_top {
+ top: 0;
+ left: 0;
+ border-right: none;
+ border-bottom: none;
+}
+
+.border_corner_right_top {
+ top: 0;
+ right: 0;
+ border-left: none;
+ border-bottom: none;
+}
+
+.border_corner_left_bottom {
+ bottom: 0;
+ left: 0;
+ border-right: none;
+ border-top: none;
+}
+
+.border_corner_right_bottom {
+ bottom: 0;
+ right: 0;
+ border-left: none;
+ border-top: none;
+}
+</style>
diff --git a/src/components/BaseNav/WasteSolid/PublicVideo.vue b/src/components/BaseNav/WasteSolid/PublicVideo.vue
new file mode 100644
index 0000000..f87c2bb
--- /dev/null
+++ b/src/components/BaseNav/WasteSolid/PublicVideo.vue
@@ -0,0 +1,80 @@
+<template>
+ <div class="win">
+ <!-- 鍥涗釜瑙掔殑杈规鏁堟灉 -->
+ <div class="border_corner border_corner_left_top"></div>
+ <div class="border_corner border_corner_right_top"></div>
+ <div class="border_corner border_corner_left_bottom"></div>
+ <div class="border_corner border_corner_right_bottom"></div>
+ <div class="main">
+ <!-- <div class="main-video">-->
+ <video controls>
+ <source src="movie.mp4" type="video/mp4">
+ <source src="movie.ogg" type="video/ogg">
+ </video>
+ <!-- </div>-->
+ </div>
+ </div>
+</template>
+
+<script>
+export default {
+ name: 'GasVideo'
+}
+</script>
+
+<style scoped lang="less">
+.win {
+ position: relative;
+ background-color: rgba(33, 41, 69, 0.9);
+ //height: 2rem;
+
+}
+
+.main {
+ border: 1px solid #396d83;
+ width: 2.5rem;
+ height: 2.5rem;
+ video {
+ width: 100%;
+ height: 100%;
+ outline: none;
+ }
+}
+
+.border_corner {
+ z-index: 999;
+ position: absolute;
+ width: 14px;
+ height: 14px;
+ background: rgba(0, 0, 0, 0);
+ border: 1px solid #47d5ea;
+}
+
+.border_corner_left_top {
+ top: 0;
+ left: 0;
+ border-right: none;
+ border-bottom: none;
+}
+
+.border_corner_right_top {
+ top: 0;
+ right: 0;
+ border-left: none;
+ border-bottom: none;
+}
+
+.border_corner_left_bottom {
+ bottom: 0;
+ left: 0;
+ border-right: none;
+ border-top: none;
+}
+
+.border_corner_right_bottom {
+ bottom: 0;
+ right: 0;
+ border-left: none;
+ border-top: none;
+}
+</style>
diff --git a/src/components/BaseNav/SolidWaste/SolidWaste.js b/src/components/BaseNav/WasteSolid/SolidWaste.js
similarity index 100%
rename from src/components/BaseNav/SolidWaste/SolidWaste.js
rename to src/components/BaseNav/WasteSolid/SolidWaste.js
diff --git a/src/components/BaseNav/WireSurface/index.js b/src/components/BaseNav/WireSurface/index.js
deleted file mode 100644
index 3021c37..0000000
--- a/src/components/BaseNav/WireSurface/index.js
+++ /dev/null
@@ -1,22 +0,0 @@
-// // 寮曞叆鐢ㄤ簬澶勭悊鎺ュ彛鏁版嵁鑾峰彇鐨勬柟娉�
-// import {} from '@src/api/request'
-//
-// class initWireSurface {
-// constructor (options) {
-// this.map = options.map
-// this.L = window.L
-// this.initWireSurfaceMap = new Map()
-// this.initWireSurfacePopup = this.L.layerGroup().addTo(this.map)
-// }
-//
-// // 鑾峰彇椤甸潰绾�/闈㈡暟鎹�
-// getDataInitWireSurface () {
-// ().then(res => {
-// console.log(res)
-// }).catch(error => {
-// console.log(error)
-// })
-// }
-// }
-//
-// export default initWireSurface
diff --git a/src/components/table/summarySheets.vue b/src/components/table/summarySheets.vue
index fab563b..f617428 100644
--- a/src/components/table/summarySheets.vue
+++ b/src/components/table/summarySheets.vue
@@ -46,7 +46,9 @@
import Warn from './components/Warn'
import IndexStatistics from './components/IndexStatistics'
-import '@/components/BaseNav/SolidWaste/directive/dir'
+// import '@/components/BaseNav/SolidWaste/directive/dir'
+// import '@/components/plugin/DialogDrag'
+
import bus from '@/eventBus'
export default {
name: 'summary-sheet.vue',
--
Gitblit v1.8.0