Merge branch 'test' of https://git.code.tencent.com/lian-cbtc/jl-client into test

2020-11-02 16:32:19 +08:00 · 2020-11-02 16:32:19 +08:00 · 6ba55206cb
commit 6ba55206cb
parent 96ecadce56 b26f3044dc
5 changed files with 150 additions and 116 deletions
--- a/src/directive/quickMenuDrag/quickMenuDrag.js
+++ b/src/directive/quickMenuDrag/quickMenuDrag.js
@ -17,10 +17,10 @@ export default {
            /**  注意在ie中 第一次获取到的值为组件自带50% 移动之后赋值为px*/
            if (sty.left.includes('%')) {
                styL = +document.body.clientWidth * (+sty.left.replace(/\%/g, '') / 100);
-                styT = +document.body.clientHeight * (+sty.top.replace(/\%/g, '') / 100);
+                styT = +document.body.clientHeight * (+sty.bottom.replace(/\%/g, '') / 100);
            } else {
                styL = +sty.left.replace(/\px/g, '');
-                styT = +sty.top.replace(/\px/g, '');
+                styT = +sty.bottom.replace(/\px/g, '');
            }

            document.onmousemove = function (e) {
@ -28,20 +28,23 @@ export default {
                const l = e.clientX - disX;
                const t = e.clientY - disY;

+                console.log(l, l + styL, dragDom.style.left);
+
                /** 移动当前元素*/
                if (l + styL < 0) {
                    dragDom.style.left = `0px`;
-                } else if (l + styL > document.body.clientWidth - dragDom.clientWidth - 30) {
-                    dragDom.style.left = `${document.body.clientWidth - dragDom.clientWidth - 30}px`;
+                } else if (l + styL > document.body.clientWidth - dragDom.clientWidth - 100) {
+                    dragDom.style.left = `${document.body.clientWidth - dragDom.clientWidth - 100}px`;
                } else {
                    dragDom.style.left = `${l + styL}px`;
                }
-                if (t + styT < 0) {
-                    dragDom.style.top = `0px`;
-                } else if (t + styT > document.body.clientHeight - dragDom.clientHeight - 10) {
-                    dragDom.style.top = `${document.body.clientHeight - dragDom.clientHeight - 10}px`;
+
+                if (document.body.clientHeight - (styT - t) - dragDom.clientHeight < 0) {
+                    dragDom.style.bottom = `${document.body.clientHeight - dragDom.clientHeight}px`;
+                } else if (document.body.clientHeight - (styT - t) - dragDom.clientHeight > document.body.clientHeight - dragDom.clientHeight) {
+                    dragDom.style.bottom = `0px`;
                } else {
-                    dragDom.style.top = `${t + styT}px`;
+                    dragDom.style.bottom = `${styT - t}px`;
                }

                /** 将此时的位置传出去*/
--- a/src/jmapNew/config/skinCode/haerbin_01.js
+++ b/src/jmapNew/config/skinCode/haerbin_01.js
@ -266,7 +266,7 @@ class SkinCode extends defaultStyle {
                z:1,
                position: 1,								// 停跳方向
                text: 'S',									// 停跳显示内容
-                offset: { x: 10, y: 20 },
+                offset: { x: 20, y: 21 },
                textColor: '#00FF00',						// 停跳文字颜色
                fontWeight: 'bold',						// 文字居中
                fontSize: 18								// 文字大小
--- a/src/views/drts/scene/modify.vue
+++ b/src/views/drts/scene/modify.vue
@ -610,7 +610,6 @@ export default {
            };
        },
        objectSpanMethod({ row, column, rowIndex, columnIndex }) {
-            debugger;
            if (this.startArray.length > 0) {
                if (columnIndex === 0) {
                    let rowspan = 1;
--- a/src/views/newMap/displayNew/exam/tipExamList.vue
+++ b/src/views/newMap/displayNew/exam/tipExamList.vue
@ -1,75 +1,78 @@
 <template>
-  <div v-drag class="reminder-drag">
-    <div ref="drapBox" class="reminder-box" :style="{bottom: offsetBottom + 'px'}">
+  <div v-quickMenuDrag class="reminder-drag" :style="{bottom: offsetBottom + 'px'}">
+    <div ref="drapBox" class="reminder-box">
      <div class="tip-title">
        <i v-show="isShrink" class="icon el-icon-minus" @click="shrink" />
        <i v-show="!isShrink" class="icon el-icon-plus" @click="shrink" />
        <p v-if="!isShrink" style="color: #fff;">
          <span class="time-label">{{ $t('display.exam.examTime') }}</span>
-
          <span class="time-elem">{{ formatRemainTime }}</span>
        </p>
        <p v-if="isShrink" style="color: #fff;">
          <span>{{ examName }}</span>
        </p>
      </div>
-      <div ref="dragBody" class="tip-body-box">
-        <div v-show="detailShow" class="tip-body">
-          <el-scrollbar wrap-class="scrollbar-wrapper">
-            <el-tree
-              ref="treeQuestion"
-              :data="trainingList"
-              node-key="id"
-              highlight-current
-              @node-click="getTrainDetail"
-            >
-              <span slot-scope="{ data }">
-                <span :style="{color: data.usedTime !== undefined ? 'green':''}">&nbsp;{{ trainingList.indexOf(data)+1 }}.{{
-                  data.trainingName }}
+      <div v-if="isShrink" class="reminder-box-content">
+        <div class="zhezhao" />
+        <div ref="dragBody" class="tip-body-box">
+          <div v-show="detailShow" class="tip-body">
+            <el-scrollbar wrap-class="scrollbar-wrapper">
+              <el-tree
+                ref="treeQuestion"
+                style="background:rgba(0,0,0,0)"
+                :data="trainingList"
+                node-key="id"
+                highlight-current
+                @node-click="getTrainDetail"
+              >
+                <span slot-scope="{ data }">
+                  <span :style="{color: data.usedTime !== undefined ? 'green':''}">&nbsp;{{ trainingList.indexOf(data)+1 }}.{{
+                    data.trainingName }}
+                  </span>
                </span>
-              </span>
-            </el-tree>
-          </el-scrollbar>
-        </div>
-        <div v-show="!detailShow" class="tip-body">
-          <el-scrollbar wrap-class="scrollbar-wrapper">
-            <p class="list-item">
-              <span class="list-label">{{ $t('display.exam.questionTitle') }}</span>
-              <span class="list-elem">{{ courseModel.name }}</span>
-            </p>
-            <p class="list-item">
-              <span class="list-label">{{ $t('display.exam.bestTime') }}</span>
-              <span class="list-elem">{{ courseModel.minDuration }} {{ $t('display.seconds') }} </span>
-            </p>
-            <p class="list-item">
-              <span class="list-label">{{ $t('display.exam.maximumTime') }}</span>
-              <span class="list-elem">{{ courseModel.maxDuration }} {{ $t('display.seconds') }} </span>
-            </p>
-            <p class="list-item">
-              <span class="list-label"> {{ $t('display.exam.trainingInstructions') }}</span>
-              <span class="list-elem">{{ courseModel.remarks }}</span>
-            </p>
-          </el-scrollbar>
-        </div>
-        <div class="tip-foot">
-          <div v-show="!detailShow" class="foot-detail">
-            <el-button class="btn" @click="backList">{{ $t('display.exam.viewQuestions') }}</el-button>
-            <el-button v-if="!isFirst" class="btn" type="primary" @click="lastExam">{{ $t('display.exam.prev') }}</el-button>
-            <el-button v-if="!isLast" class="btn" type="primary" @click="nextExam">{{ $t('display.exam.next') }}</el-button>
-            <el-button v-if="isLast" class="btn" type="primary" @click="overExam">{{ $t('display.exam.submitExaminationPaper') }}</el-button>
+              </el-tree>
+            </el-scrollbar>
          </div>
-          <div v-show="detailShow" class="foot-submit">
-            <el-button class="btn" type="primary" @click="overExam">{{ $t('display.exam.submitExaminationPaper') }}</el-button>
+          <div v-show="!detailShow" class="tip-body">
+            <el-scrollbar wrap-class="scrollbar-wrapper">
+              <p class="list-item">
+                <span class="list-label">{{ $t('display.exam.questionTitle') }}</span>
+                <span class="list-elem">{{ courseModel.name }}</span>
+              </p>
+              <p class="list-item">
+                <span class="list-label">{{ $t('display.exam.bestTime') }}</span>
+                <span class="list-elem">{{ courseModel.minDuration }} {{ $t('display.seconds') }} </span>
+              </p>
+              <p class="list-item">
+                <span class="list-label">{{ $t('display.exam.maximumTime') }}</span>
+                <span class="list-elem">{{ courseModel.maxDuration }} {{ $t('display.seconds') }} </span>
+              </p>
+              <p class="list-item">
+                <span class="list-label"> {{ $t('display.exam.trainingInstructions') }}</span>
+                <span class="list-elem">{{ courseModel.remarks }}</span>
+              </p>
+            </el-scrollbar>
          </div>
-          <p style="color: #000; float: left;">
-            <span class="time-label">{{ $t('display.exam.examTime') }}</span>
-            <span class="time-elem">{{ formatRemainTime }}</span>
-          </p>
+          <div class="tip-foot">
+            <div v-show="!detailShow" class="foot-detail">
+              <el-button class="btn" @click="backList">{{ $t('display.exam.viewQuestions') }}</el-button>
+              <el-button v-if="!isFirst" class="btn" type="primary" @click="lastExam">{{ $t('display.exam.prev') }}</el-button>
+              <el-button v-if="!isLast" class="btn" type="primary" @click="nextExam">{{ $t('display.exam.next') }}</el-button>
+              <el-button v-if="isLast" class="btn" type="primary" @click="overExam">{{ $t('display.exam.submitExaminationPaper') }}</el-button>
+            </div>
+            <div v-show="detailShow" class="foot-submit">
+              <el-button class="btn" type="primary" @click="overExam">{{ $t('display.exam.submitExaminationPaper') }}</el-button>
+            </div>
+            <p style="color: #000; float: left;">
+              <span class="time-label">{{ $t('display.exam.examTime') }}</span>
+              <span class="time-elem">{{ formatRemainTime }}</span>
+            </p>
+          </div>
+          <div class="drag-right" />
+          <div class="drag-left" />
+          <div class="drag-bottom" />
+          <div class="drag-top" />
        </div>
-        <div class="drag-right" />
-        <div class="drag-left" />
-        <div class="drag-bottom" />
-        <div class="drag-top" />
      </div>
    </div>
  </div>
@ -298,16 +301,22 @@ export default {
            });
        },
        shrink() {
-            const height = this.$refs.dragBody.offsetHeight + 40;
-            const top = this.$refs.drapBox.style.top;
+            // const height = this.$refs.dragBody.offsetHeight + 40;
+            // const top = this.$refs.drapBox.style.top;
            if (this.isShrink) {
-                this.$refs.drapBox.style.height = '40px';
-                this.$refs.drapBox.style.top = '';
+                // this.$refs.drapBox.style.height = '40px';
+                // this.$refs.drapBox.style.top = '';
                this.isShrink = false;
            } else {
-                this.$refs.drapBox.style.height = height + 'px';
-                this.$refs.drapBox.style.top = top;
+                // this.$refs.drapBox.style.height = height + 'px';
+                // this.$refs.drapBox.style.top = top;
                this.isShrink = true;
+                this.$nextTick(()=>{
+                    const dragDom = document.querySelector('.reminder-drag').style.bottom;
+                    if (document.body.clientHeight - 470 - parseInt(dragDom.replace('px', '')) < 0) {
+                        document.querySelector('.reminder-drag').style.bottom = `${document.body.clientHeight - 470}px`;
+                    }
+                });
            }
        }
    }
@ -316,26 +325,46 @@ export default {
 <style rel="stylesheet/scss" lang="scss" scoped>
    @import "src/styles/mixin.scss";

+    .reminder-drag{
+        position: absolute;
+        bottom: 0px;
+        left: 15px;
+        z-index: 10;
+    }
+
    .tip-body-box {
        position: relative;
        height: 430px;
+        position: absolute;
+        left: 0;
+        top: 0;
+        width: 100%;
+    }
+
+    .zhezhao{
+        width: 100%;
+        height: 100%;
+        filter: blur(8px);
+        background: rgba(255,255,255,0.9);
+    }
+    .reminder-box-content{
+        width: 500px;
+        height: 430px;
+        left: 0;
+        top: 0;
+        z-index: 2;
+        background: rgba(255,255,255,0.8);
+        position: relative;
    }

    .reminder-box {
-        position: absolute;
-        float: left;
-        left: 15px;
-        bottom: 15px;
-        width: 650px;
-        height: 470px;
-        background-color: #fff;
        border-radius: 5px;
        overflow: hidden;
        z-index: 10;
        font-size: 18px;

        .tip-title {
-            width: 100%;
+            width: 500px;
            overflow: hidden;
            height: 40px;
            display: flex;
@ -385,7 +414,7 @@ export default {
        }

        .tip-body {
-            height: 366px;
+            height: 370px;
            padding: 10px;

            .list-label {
@ -398,7 +427,6 @@ export default {
            position: absolute;
            right: 0px;
            bottom: 0px;
-            background-color: #fff;
            padding: 10px 0 10px 10px;

            .foot-detail {
--- a/src/views/newMap/displayNew/lesson/tipTrainingDetail.vue
+++ b/src/views/newMap/displayNew/lesson/tipTrainingDetail.vue
@ -1,16 +1,16 @@
 <template>
  <!-- v-drag  拖拽 调整宽高 -->
-  <div v-quickMenuDrag class="reminder-drag">
-    <div ref="drapBox" class="reminder-box" :style="{bottom: offsetBottom + 'px'}">
-      <div class="zhezhao" />
-      <div class="reminder-box-content">
-        <div class="tip-title">
-          <i v-show="isShrink" class="icon el-icon-minus" @click="shrink" />
-          <i v-show="!isShrink" class="icon el-icon-plus" @click="shrink" />
-          <p v-if="isShrink" style="color: #fff;">
-            <span>{{ lessonName }}</span>
-          </p>
-        </div>
+  <div v-quickMenuDrag class="reminder-drag" :style="{bottom: offsetBottom + 'px'}">
+    <div ref="drapBox" class="reminder-box">
+      <div class="tip-title">
+        <i v-show="isShrink" class="icon el-icon-minus" @click="shrink" />
+        <i v-show="!isShrink" class="icon el-icon-plus" @click="shrink" />
+        <p v-if="isShrink" style="color: #fff;">
+          <span>{{ lessonName }}</span>
+        </p>
+      </div>
+      <div v-if="isShrink" class="reminder-box-content">
+        <div class="zhezhao" />
        <div ref="dragBody" class="tip-body-box">
          <div class="tip-body">
            <el-scrollbar wrap-class="scrollbar-wrapper">
@ -135,16 +135,23 @@ export default {
            launchFullscreen();
        },
        shrink() {
-            const height = this.$refs.dragBody.offsetHeight + 40;
-            const top = this.$refs.drapBox.style.top;
+            // const height = this.$refs.dragBody.offsetHeight + 40;
+            // const top = this.$refs.drapBox.style.top;
            if (this.isShrink) {
-                this.$refs.drapBox.style.height = '40px';
-                this.$refs.drapBox.style.top = '';
+                //
+                // this.$refs.drapBox.style.height = '40px';
+                // this.$refs.drapBox.style.top = '';
                this.isShrink = false;
            } else {
-                this.$refs.drapBox.style.height = height + 'px';
-                this.$refs.drapBox.style.top = top;
                this.isShrink = true;
+                this.$nextTick(()=>{
+                    const dragDom = document.querySelector('.reminder-drag').style.bottom;
+                    if (document.body.clientHeight - 300 - parseInt(dragDom.replace('px', '')) < 0) {
+                        document.querySelector('.reminder-drag').style.bottom = `${document.body.clientHeight - 300}px`;
+                    }
+                });
+                // this.$refs.drapBox.style.height = height + 'px';
+                // this.$refs.drapBox.style.top = top;
            }
        }
    }
@ -156,14 +163,17 @@ export default {
    .tip-body-box {
        position: relative;
        height: 260px;
+        position: absolute;
+        left: 0;
+        top: 0;
+        width: 100%;
    }

    .reminder-drag{
        position: absolute;
-        width: 500px;
-        height: 300px;
        bottom: 0px;
-        left: 0px;
+        left: 15px;
+        z-index: 10;
    }

    .elem-span{
@ -175,37 +185,31 @@ export default {
        height: 100%;
        filter: blur(8px);
        background: rgba(255,255,255,0.9);
+        position:absolute;
    }
    .reminder-box-content{
-        position: absolute;
-        width: 100%;
-        height: 100%;
+        width: 500px;
+        height: 260px;
        left: 0;
        top: 0;
        z-index: 2;
        background: rgba(255,255,255,0.8);
+        position: relative;
    }
    .reminder-box {
-        position: absolute;
-        float: left;
-        left: 15px;
-        bottom: 15px;
-        width: 500px;
-        height: 300px;
-        background: transparent;
        border-radius: 5px;
        overflow: hidden;
        z-index: 10;
        font-size: 18px;

        .tip-title {
-            width: 100%;
+            width: 500px;
            overflow: hidden;
            height: 40px;
            display: flex;
            align-items: center;
            flex-direction: row-reverse;
-            background-color: rgba(64, 158, 255,0.8);
+            background-color: rgba(64, 158, 255,1);
            border-radius: 5px 5px 0 0;
            justify-content: space-between;
            padding: 0 10px;
@ -249,7 +253,7 @@ export default {
        }

        .tip-body {
-            height: 366px;
+            height: 260px;
            padding: 10px;

            .list-label {