Merge branch 'master' of coding.yundingshuyuan.com:pigbigbig/beyond-clouds-front

05b6d942 · yanju · b0aa63b9 · 517af4e8 · 05b6d942 · 05b6d942
Commit 05b6d942 authored Feb 14, 2020 by yanju
Show whitespace changes
Inline Side-by-side

Showing with 75 additions and 11 deletions

pages/answer/release/index.vue
+12 -5

pages/blog/release/index.vue
+53 -5

pages/project/release/index.vue
+10 -1

No files found.
--- a/pages/answer/release/index.vue
+++ b/pages/answer/release/index.vue
@@ -159,7 +159,7 @@
          preview: true // 预览
        },
        zIndex: 100,
-        value: '',
+        content: '',
        tagList: new Set(),
        i:0,
        blogClass:'',
@@ -338,9 +338,16 @@
        this.questionDetail = render;
      },
-      readScreen(boolean, str){ // 预览
+      readScreen(boolean, str) { // 预览
+        let offsetWidth;
+        this.$nextTick(() => {
+          offsetWidth = this.$refs.questionDetail.$el.offsetWidth;
+          if (offsetWidth > 723) {
            this.zIndex = 8000;
-        boolean = true;
+          } else {
+            this.zIndex = 100;
+          }
+        });
      }
    }
  }
@@ -415,11 +422,11 @@
          .editor-container {
            width: 723*$length;
            height: 230*$length;
+            overflow: auto;
+            box-shadow: rgba(0, 0, 0, 0.1) 0 2*$length 12*$length 0;
            .editor {
              min-height: 230*$length;
              min-width: 723*$length;
-              max-height:230*$length;
-              max-width: 732*$length;
            }
          }
        }

--- a/pages/blog/release/index.vue
+++ b/pages/blog/release/index.vue
@@ -44,7 +44,8 @@
                ></select-card>
              </div>
              <!-- 博客链接 -->
-              <input v-if="false" type="text" placeholder="相关链接" style="width: 461px;" v-model="originLink" ref="originLink">
+              <input v-if="false" type="text" placeholder="相关链接" style="width: 461px;" v-model="originLink"
+                     ref="originLink">
            </div>
            <div class="header-content">
              <span>*</span>
@@ -118,7 +119,7 @@
            </p>
            <div class="footer__right">
              <p>已自动存为草稿</p>
-              <button class="preview" @click="readScreen">预览</button>
+              <button class="preview" @click="preview">预览</button>
              <button class="submit" v-on:click="dataPost">提交</button>
            </div>
          </div>
@@ -166,6 +167,7 @@ export default {
    }
  },
  mounted() {
+    console.log(this.$refs.content);
    if (this.$route.query.id) {
      this.blogTitle = this.detailContent.blogTitle;
      this.originLink = this.detailContent.originLink;
@@ -246,6 +248,12 @@ export default {
    }
  },
  methods: {
+    preview() {
+      console.log(32);
+      this.$nextTick(() => {
+        // this.$refs.content.readmodel();
+      })
+    },
    toDetail(path) {
      this.$router.push(`/blog/detail/${path}`);
    },
@@ -328,7 +336,7 @@ export default {
        });
        return false;
      }
-      if (Array.from(this.tagList).length===0) {
+      if (Array.from(this.tagList).length === 0) {
        this.$refs.tagIds.handleShow();
        this.$refs.tagIds.$refs.tag.focus();
        this.$message({
@@ -473,7 +481,15 @@ export default {
      // if (now - this.lastSaveTime >= 2 * 1000) {}
    },
    readScreen(boolean, str) { // 预览
-      this.zIndex = 8000
+      let offsetWidth;
+      this.$nextTick(() => {
+        offsetWidth = this.$refs.content.$el.offsetWidth;
+        if (offsetWidth > 723) {
+          this.zIndex = 8000;
+        } else {
+          this.zIndex = 100;
+        }
+      });
    }
  },
 }
@@ -483,6 +499,7 @@ export default {
  input {
    border: 1*$length solid transparent;
    @extend %animate-transition;
    &:focus {
      border: 1*$length solid #00AAE6;
    }
@@ -494,20 +511,24 @@ export default {
    @extend %flex-row-spb;
    align-items: start;
    overflow: hidden;
    .blog-release-container__l {
      .blog-release_List {
        width: 266*$length;
        padding: 0 18*$length;
        .blog-box {
          margin: 15*$length 0;
          @extend %cursorPointer;
-          @include fontStyle(13,17,500,#333,left);
+          @include fontStyle(13, 17, 500, #333, left);
          @extend %flex-row-spb;
          @extend %cursorPointer;
          .blog-box__title {
            width: 60%;
            @extend %nowrap;
          }
          &:hover {
            color: #00AAE6;
          }
@@ -521,15 +542,19 @@ export default {
      .blog-release {
        width: 748*$length;
        margin: 0 auto;
        .blog-release__header {
          margin-top: 40*$length;
          .header-content {
            @extend %flex-row-spb;
            margin-bottom: 32*$length;
            > span {
              color: #FF7474;
              font-size: 6*$length;
            }
            > input {
              width: 726*$length;
              padding: 14*$length 16*$length;
@@ -538,9 +563,11 @@ export default {
              @include border-radius(4*$length);
              @include fontStyle(14, 46, 500, #666, left);
            }
            .select__wrap {
              @extend %flex-row-spb;
              align-items: start;
              > span {
                color: #FF7474;
                font-size: 6*$length;
@@ -554,16 +581,20 @@ export default {
        .blog-release__content {
          @extend %flex-row-spb;
          align-items: start;
          > span {
            display: inline-block;
            margin-top: 18*$length;
            color: #FF7474;
            font-size: 6*$length;
          }
          .editor-container {
            width: 723*$length;
            height: 230*$length;
            overflow: auto;
+            box-shadow: rgba(0, 0, 0, 0.1) 0 2*$length 12*$length 0;
            .editor {
              min-height: 230*$length;
              min-width: 723*$length;
@@ -575,9 +606,11 @@ export default {
          @extend %flex-row-spb;
          align-items: start;
          margin-top: 32*$length;
          .select-content {
            @extend %flex-row-spb;
            align-items: start;
            > span {
              color: #FF7474;
              font-size: 6*$length;
@@ -589,23 +622,29 @@ export default {
        .choose-container {
          @extend %flex-row-spb;
          .input-box__wrap {
            @extend %flex-row-spb;
            > span {
              margin-right: 16*$length;
              color: #FF7474;
              font-size: 6*$length;
            }
            .input-box {
              margin-right: 40*$length;
              line-height: 16*$length;
              input[type="radio"] {
                display: none;
              }
              label {
                @include fontStyle(12, 16, 500, #999, left);
                vertical-align: middle;
              }
              input[type="radio"] + label::before {
                content: "\a0"; /*不换行空格*/
                display: inline-block;
@@ -620,6 +659,7 @@ export default {
                background-color: #fff;
                @include border-radius(2*$length);
              }
              input[type="radio"]:checked + label::before {
                display: inline-block;
                width: 12*$length;
@@ -643,6 +683,7 @@ export default {
        @extend %flex-row-spb;
        align-items: flex-end;
        margin-top: 35*$length;
        .footer__left {
          overflow: hidden;
          width: 196*$length;
@@ -650,6 +691,7 @@ export default {
          @extend %cursorPointer;
          @include border-radius(4*$length);
          @include fontStyle(12, 130, 500, #666, center);
          & input {
            float: left;
            height: 100%;
@@ -658,6 +700,7 @@ export default {
            transform: translateY(-200%);
            @extend %cursorPointer;
          }
          & img {
            float: left;
            height: 100%;
@@ -666,13 +709,16 @@ export default {
            object-fit: contain;
          }
        }
        .footer__right {
          @extend %flex-row-spb;
          justify-content: flex-end;
          > p {
            margin-right: 32*$length;
            @include fontStyle(12, 16, 500, #999, left);
          }
          > button {
            @include fontStyle(14, 19, 500, #fff, center);
            width: 100*$length;
@@ -682,11 +728,13 @@ export default {
            @extend %cursorPointer;
            @include border-radius(4*$length);
          }
          .preview {
            color: #666;
            background-color: #fff;
            margin-right: 16*$length;
            @extend %animate-transition;
            &:hover {
              color: #fff;
              background-color: #00AAE6;

--- a/pages/project/release/index.vue
+++ b/pages/project/release/index.vue
@@ -320,7 +320,15 @@ export default {
      this.imgSrc = pic;
    },
    readScreen(boolean, str) { // 预览
-      this.zIndex = 8000
+      let offsetWidth;
+      this.$nextTick(() => {
+        offsetWidth = this.$refs.editor.$el.offsetWidth;
+        if (offsetWidth > 723) {
+          this.zIndex = 8000;
+        } else {
+          this.zIndex = 100;
+        }
+      });
    },
    // 检测网址
    checkAddress(address, ref) {
@@ -579,6 +587,7 @@ export default {
            width: 723*$length;
            height: 230*$length;
            overflow: auto;
+            box-shadow: rgba(0, 0, 0, 0.1) 0 2*$length 12*$length 0;
            .editor {
              min-height: 230*$length;
              min-width: 723*$length;