{"remainingRequest":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/node_modules/vue-loader/lib/index.js??vue-loader-options!/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/src/views/moment/childComps/ChildDetailMoment.vue?vue&type=style&index=0&id=cb47cba6&scoped=true&lang=css&","dependencies":[{"path":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/src/views/moment/childComps/ChildDetailMoment.vue","mtime":1617590291598},{"path":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/node_modules/css-loader/dist/cjs.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/node_modules/vue-loader/lib/loaders/stylePostLoader.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/node_modules/postcss-loader/src/index.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/node_modules/vue-loader/lib/index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:CgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKLm1haW5jb250ZW50IHsKICBtYXJnaW46IDhweCA1cHg7CiAgZm9udC1zaXplOiAxNnB4Owp9Cgouc2hvd2NvbW1lbnQgewogIHBvc2l0aW9uOiBmaXhlZDsKICBib3R0b206IDBweDsKICBkaXNwbGF5OiBibG9jazsKICBkaXNwbGF5OiBmbGV4OwogIGJhY2tncm91bmQtY29sb3I6ICNmNWY1ZjU7Cn0KCi5zaG93Y29tbWVudCBzcGFuIHsKICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7CiAgbWFyZ2luOiBhdXRvIGF1dG87CiAgY29sb3I6ICNmNTNiNTc7Cn0KLmlucHV0Y29tbWVudCB7CiAgbWFyZ2luOiA1cHg7CiAgcGFkZGluZzogNXB4OwogIHdpZHRoOiA4MCU7CiAgZGlzcGxheTogaW5saW5lLWJsb2NrOwogIGJhY2tncm91bmQtY29sb3I6ICNmZmY7CiAgYm9yZGVyLXJhZGl1czogMjBweDsKfQoKLmljb24gewogIG1hcmdpbi10b3A6IDE1cHg7CiAgYm9yZGVyLXRvcDogMXB4IHNvbGlkIHJnYigyNDUsIDI0MywgMjQzKTsKfQoKLm1vbWVudCB7Cn0KCi5uYW1lIHsKICBtYXJnaW4tdG9wOiAyMHB4OwogIGZvbnQtd2VpZ2h0OiA2MDA7Cn0KCi50aW1lIHsKICBtYXJnaW4tdG9wOiAxMHB4OwogIGZvbnQtc2l6ZTogMTJweDsKfQoKLmNvbW1lbnRzYXJlYSB7CiAgbWFyZ2luLXRvcDogNXB4OwogIG1hcmdpbi1sZWZ0OiA1cHg7Cn0KCi50b3AgewogIGRpc3BsYXk6IGZsZXg7CiAgaGVpZ2h0OiA5MHB4Owp9CgouaW1hZ2UgewogIG1hcmdpbi10b3A6IDE1cHg7CiAgZGlzcGxheTogZmxleDsKICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWV2ZW5seTsKfQoKLm1vbWVudCAudG9wID4gaW1nIHsKICBtYXJnaW46IDEwcHggMTBweDsKICBoZWlnaHQ6IDcwcHg7CiAgd2lkdGg6IDcwcHg7CiAgYm9yZGVyLXJhZGl1czogNTAlOwp9CgpsaSB7CiAgbGlzdC1zdHlsZTogbm9uZTsKfQoKLnByYWlzZSB7CiAgZGlzcGxheTogYmxvY2s7Cn0KCi5jb250ZW50IHsKICBsZWZ0OiAwOwogIHJpZ2h0OiAwOwogIHRvcDogNDRweDsKICBib3R0b206IDBweDsKICBvdmVyZmxvdzogaGlkZGVuOwogIHBvc2l0aW9uOiBhYnNvbHV0ZTsKfQo="},{"version":3,"sources":["ChildDetailMoment.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4PA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"ChildDetailMoment.vue","sourceRoot":"src/views/moment/childComps","sourcesContent":["<template>\n  <div class=\"moment\">\n    <Scroll\n      class=\"content\"\n      ref=\"scroll\"\n      :pull-up-load=\"true\"\n      :probe-type=\"3\"\n      @pullingUp=\"loadMore\"\n      @pullingDown=\"pullingDown\"\n    >\n      <!-- 基本内容 -->\n      <div class=\"top\">\n        <img :src=\"comments.author && comments.author.avatarUrl\" />\n        <div class=\"desc\">\n          <div class=\"name\">{{ comments.author && comments.author.name }}</div>\n          <div class=\"time\">\n            {{ this.$moment(comments.createTime).fromNow() }}\n          </div>\n        </div>\n      </div>\n      <!-- 内容区域 -->\n      <div class=\"maincontent\">{{ comments.content }}</div>\n      <!-- 图片区域 -->\n      <div>\n        <div class=\"image\">\n          <li\n            v-for=\"(item, index) in comments.images\"\n            :key=\"index\"\n            class=\"picture\"\n          >\n            <img\n              width=\"100px\"\n              height=\"100px\"\n              :preview=\"index\"\n              :src=\"item + '?type=small'\"\n            />\n            <!-- v-lazy=\"item+'?type=small'\" -->\n          </li>\n        </div>\n      </div>\n      <!-- 小图标区域 -->\n      <icon\n        class=\"icon\"\n        :comments=\"comments\"\n        :praise=\"this.praise\"\n        @clickpraise=\"clickpraise\"\n        @Popup=\"Popup\"\n        v-if=\"this.isdisplay\"\n      ></icon>\n      <!-- 点赞 -->\n      <PraiseList\n        class=\"praise\"\n        :praises=\"this.praise.praise\"\n        v-if=\"this.isdisplay\"\n      >\n      </PraiseList>\n\n      <!-- 评论 -->\n      <CommentList\n        class=\"commentsarea\"\n        :newcomments=\"this.allcomment\"\n        :Author=\"comments.author\"\n      ></CommentList>\n\n      <!-- 发表评论 -->\n      <!-- show是否要显示评论 -->\n    </Scroll>\n    <van-popup v-model=\"show\" class=\"showcomment\" position=\"bottom\">\n      <van-field\n        ref=\"gain\"\n        class=\"inputcomment\"\n        v-model=\"comment.content\"\n        rows=\"1\"\n        autosize\n        placeholder=\"输入你想表达～\"\n        show-word-limit\n        type=\"textarea\"\n        size=\"large\"\n      />\n      <span className=\"postcomment\" round type=\"info\" @click=\"createcomment\"\n        >发送</span\n      >\n    </van-popup>\n  </div>\n</template>\n\n<script>\nimport icon from \"@/views/moment/childComps/icon\";\nimport CommentList from \"@/components/content/comments/CommentList\";\nimport PraiseList from \"@/components/content/praises/PraiseList\";\nimport { getAllCommnet } from \"@/network/comment\";\nimport Scroll from \"@/components/common/Scroll/Scroll\";\nexport default {\n  name: \"ChildDetailMoment\",\n  components: {\n    CommentList,\n    PraiseList,\n    icon,\n    Scroll\n  },\n  props: {\n    comments: {\n      type: Object,\n      default() {\n        return {};\n      }\n    }\n  },\n  data() {\n    return {\n      id: \"\",\n      show: false,\n      isResize: false,\n      isshow: true,\n      comment: {\n        content: \"\",\n        momentId: \"\"\n      },\n      iscomment: true,\n      allcomment: [],\n      praise: {},\n      ispraise: \"\",\n      number: \"\",\n      isdisplay: \"true\",\n      clientHeight: document.documentElement.clientHeight\n    };\n  },\n  created() {\n    this.momentId = this.$route.params.iid;\n    getAllCommnet(this.momentId).then(res => {\n      this.allcomment = res.data;\n    });\n    this.getdata();\n  },\n  //局部组成聚焦\n  directives: {\n    focus: {\n      // 指令的定义\n      inserted: function(el) {\n        el.focus();\n      }\n    }\n  },\n  methods: {\n    loadMore() {\n      this.$refs.scroll.refresh();\n    },\n    pullingDown() {\n      this.pullingdown = true;\n      setTimeout(() => {\n        this.pullingdown = false;\n        this.$refs.scroll.finishPullDown();\n      }, 300);\n    },\n    async getdata() {\n      const { data: res } = await this.$http.get(\"/praise/\" + this.momentId);\n      this.praise = res;\n    },\n    //是否显示评论和聚焦效果拉键盘\n    Popup() {\n      this.show = !this.show;\n      //延迟聚焦\n      this.$nextTick(() => {\n        this.$refs.gain.focus();\n      }, 3000);\n    },\n    refresh() {\n      this.isdisplay = false;\n      this.$nextTick(() => {\n        this.isdisplay = true;\n      }, 100);\n      this.getdata();\n    },\n    //发表成功评论\n    async createcomment() {\n      this.comment.momentId = this.comments.id;\n      if (this.iscomment) {\n        const { data: res } = await this.$http.post(\"comment\", this.comment);\n        if (res.insertId != 0) {\n          this.$emit(\"refresh\");\n          this.$message.success(\"评论成功\");\n        }\n      } else {\n        const { data: res } = await this.$http.post(\n          \"comment/\" + this.commentId + \"/reply\",\n          this.comment\n        );\n        if (res.insertId != 0) {\n          this.iscomment = true;\n          this.$emit(\"refresh\");\n          this.$message.success(\"评论成功\");\n        }\n      }\n    },\n\n    async clickpraise() {\n      const { data: res } = await this.$http.post(\n        \"/praise/ispraise/\" + this.momentId\n      );\n      if (res.status != \"200\") {\n        this.number = window.sessionStorage.getItem(\"number\");\n        if (this.number === \"1\") window.sessionStorage.setItem(\"number\", \"0\");\n        else {\n          window.sessionStorage.setItem(\"number\", \"1\");\n        }\n      }\n      if (res.status == \"200\") {\n        await this.$http.post(\"/praise/\" + this.momentId);\n        this.$nextTick(() => {\n          this.refresh();\n        }, 100);\n      } else {\n        this.number = window.sessionStorage.getItem(\"number\");\n        const content = {\n          ispraise: \"\"\n        };\n        content.ispraise = this.number;\n        const { data: res } = await this.$http.post(\n          \"/praise/update/\" + this.momentId,\n          content\n        );\n        this.$nextTick(() => {\n          this.refresh();\n        }, 100);\n      }\n    }\n  },\n  mounted() {\n    this.$bus.$on(\"commentId\", result => {\n      this.commentId = result;\n      this.iscomment = false;\n    });\n    this.$bus.$on(\"comment\", this.Popup);\n\n    var n = navigator.userAgent;\n    var ocontent =document.getElementsByClassName('content')[0];\n    if (n.indexOf(\"iPhone\") <= -1) {\n      window.onresize = () => {\n        if (this.clientHeight > document.documentElement.clientHeight) {\n          ocontent.style.bottom=''\n          // 隐藏按钮\n        } else {\n          // 显示按钮\n          ocontent.style.bottom='0px'\n        }\n      };\n    }\n  }\n};\n</script>\n\n<style scoped>\n.maincontent {\n  margin: 8px 5px;\n  font-size: 16px;\n}\n\n.showcomment {\n  position: fixed;\n  bottom: 0px;\n  display: block;\n  display: flex;\n  background-color: #f5f5f5;\n}\n\n.showcomment span {\n  display: inline-block;\n  margin: auto auto;\n  color: #f53b57;\n}\n.inputcomment {\n  margin: 5px;\n  padding: 5px;\n  width: 80%;\n  display: inline-block;\n  background-color: #fff;\n  border-radius: 20px;\n}\n\n.icon {\n  margin-top: 15px;\n  border-top: 1px solid rgb(245, 243, 243);\n}\n\n.moment {\n}\n\n.name {\n  margin-top: 20px;\n  font-weight: 600;\n}\n\n.time {\n  margin-top: 10px;\n  font-size: 12px;\n}\n\n.commentsarea {\n  margin-top: 5px;\n  margin-left: 5px;\n}\n\n.top {\n  display: flex;\n  height: 90px;\n}\n\n.image {\n  margin-top: 15px;\n  display: flex;\n  justify-content: space-evenly;\n}\n\n.moment .top > img {\n  margin: 10px 10px;\n  height: 70px;\n  width: 70px;\n  border-radius: 50%;\n}\n\nli {\n  list-style: none;\n}\n\n.praise {\n  display: block;\n}\n\n.content {\n  left: 0;\n  right: 0;\n  top: 44px;\n  bottom: 0px;\n  overflow: hidden;\n  position: absolute;\n}\n</style>\n"]}]}