{"remainingRequest":"/Users/linhuakun/Downloads/nodejs/codewhy/node_modules/vue-loader/lib/index.js??vue-loader-options!/Users/linhuakun/Downloads/nodejs/codewhy/src/views/moment/childComps/ChildDetailMoment.vue?vue&type=script&lang=js&","dependencies":[{"path":"/Users/linhuakun/Downloads/nodejs/codewhy/src/views/moment/childComps/ChildDetailMoment.vue","mtime":1609497283273},{"path":"/Users/linhuakun/Downloads/nodejs/codewhy/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/nodejs/codewhy/node_modules/babel-loader/lib/index.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/nodejs/codewhy/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/nodejs/codewhy/node_modules/vue-loader/lib/index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:Ly8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KCgppbXBvcnQgQ29tbWVudExpc3QgZnJvbSAnQC9jb21wb25lbnRzL2NvbnRlbnQvY29tbWVudHMvQ29tbWVudExpc3QnCmltcG9ydCB7Z2V0QWxsQ29tbW5ldH0gZnJvbSAnQC9uZXR3b3JrL2NvbW1lbnQnCmV4cG9ydCBkZWZhdWx0IHsKICBuYW1lOiJDaGlsZERldGFpbE1vbWVudCIsCiAgY29tcG9uZW50czp7CiAgICBDb21tZW50TGlzdAogIH0KICAsCiAgcHJvcHM6IHsKICAgIGNvbW1lbnRzOiB7CiAgICAgIHR5cGU6IE9iamVjdCwKICAgICAgZGVmYXVsdCgpIHsKICAgICAgICByZXR1cm4ge307CiAgICAgIH0sCiAgICB9LAogIH0sCiAgZGF0YSgpIHsKICAgIHJldHVybiB7CiAgICAgIGlkOicnLAogICAgICBzaG93OiBmYWxzZSwKICAgICAgaXNSZXNpemU6IGZhbHNlLAogICAgICBpc3Nob3c6dHJ1ZSwKICAgICAgY29tbWVudDogewogICAgICBjb250ZW50OiAiIiwKICAgICAgbW9tZW50SWQ6IiIsCiAgICAgIH0sCiAgICAgIGlzY29tbWVudDogdHJ1ZSwKICAgICAgYWxsY29tbWVudDpbXQogICAgfTsKICB9LAogIGNyZWF0ZWQoKSB7CiAgICBjb25zdCBtb21lbnRJZCA9IHRoaXMuJHJvdXRlLnBhcmFtcy5paWQ7CiAgICBnZXRBbGxDb21tbmV0KG1vbWVudElkKS50aGVuKChyZXMpPT57CiAgICAgIHRoaXMuYWxsY29tbWVudD1yZXMuZGF0YTsKICAgIH0pCiAgfSwKICAvL+WxgOmDqOe7hOaIkOiBmueEpgogIGRpcmVjdGl2ZXM6IHsKICBmb2N1czogewogICAgLy8g5oyH5Luk55qE5a6a5LmJCiAgICBpbnNlcnRlZDogZnVuY3Rpb24gKGVsKSB7CiAgICAgIGVsLmZvY3VzKCkKICAgIH0KICB9Cn0sCiAgbWV0aG9kczogewogICAgLy/mmK/lkKbmmL7npLror4TorrrlkozogZrnhKbmlYjmnpzmi4nplK7nm5gKICAgIFBvcHVwKCkgewogICAgICB0aGlzLnNob3cgPSAhdGhpcy5zaG93OwogICAgICAvL+W7tui/n+iBmueEpgogICAgICB0aGlzLiRuZXh0VGljaygoKSA9PiB7CiAgICAgICAgdGhpcy4kcmVmcy5nYWluLmZvY3VzKCk7CiAgICAgIH0sIDEwMCk7CiAgICB9LAogICAgLy/lj5HooajmiJDlip/or4TorroKICAgIGFzeW5jIGNyZWF0ZWNvbW1lbnQoKXsKICAgICAgdGhpcy5jb21tZW50Lm1vbWVudElkPXRoaXMuY29tbWVudHMuaWQKICAgICAgaWYodGhpcy5pc2NvbW1lbnQpewogICAgICBjb25zdCB7IGRhdGE6IHJlcyB9ID0gYXdhaXQgdGhpcy4kaHR0cC5wb3N0KCJjb21tZW50IiwgdGhpcy5jb21tZW50KTsKICAgICAgaWYocmVzLmluc2VydElkIT0wKXsKICAgICAgICB0aGlzLiRlbWl0KCdyZWZyZXNoJykKICAgICAgICB0aGlzLiRtZXNzYWdlLnN1Y2Nlc3MoIuivhOiuuuaIkOWKnyIpOwogICAgICB9CiAgICAgIH1lbHNlewogICAgICAgIGNvbnN0IHsgZGF0YTogcmVzIH0gPSBhd2FpdCB0aGlzLiRodHRwLnBvc3QoImNvbW1lbnQvIit0aGlzLmNvbW1lbnRJZCsnL3JlcGx5JywgdGhpcy5jb21tZW50KTsKICAgICAgaWYocmVzLmluc2VydElkIT0wKXsKICAgICAgICB0aGlzLmlzY29tbWVudD10cnVlCiAgICAgICAgdGhpcy4kZW1pdCgncmVmcmVzaCcpCiAgICAgICAgdGhpcy4kbWVzc2FnZS5zdWNjZXNzKCLor4TorrrmiJDlip8iKTsKICAgICAgfQogICAgICB9CiAgICB9LAogIH0sCiAgbW91bnRlZCgpewogICAgdGhpcy4kYnVzLiRvbigiY29tbWVudElkIiwocmVzdWx0KT0+ewogICAgICB0aGlzLmNvbW1lbnRJZD1yZXN1bHQKICAgICAgdGhpcy5pc2NvbW1lbnQ9ZmFsc2UKICAgIH0pCiAgICB0aGlzLiRidXMuJG9uKCJjb21tZW50IiwgdGhpcy5Qb3B1cCk7CiAgfQp9Owo="},{"version":3,"sources":["ChildDetailMoment.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"ChildDetailMoment.vue","sourceRoot":"src/views/moment/childComps","sourcesContent":["<template>\n  <div class=\"moment-items\"  >\n    <!-- 基本内容 -->\n    <div>\n      <img class=\"avatar\" :src=\"comments.author && comments.author.avatarUrl\" />\n    </div>\n\n    <div class=\"name\">{{ comments.author && comments.author.name }}</div>\n\n    <div class=\"time\">\n      {{ this.$moment(comments.createTime).format(\"YYYY-MM-DD HH:mm:ss\") }}\n    </div>\n    <!-- 图片区域 -->\n    <div class=\"content\">\n      <div class=\"text\">{{ comments.content }}</div>\n      <div class=\"image\">\n        <li\n          v-for=\"(item, index) in comments.images\"\n          :key=\"index\"\n          class=\"picture\"\n        >\n          <img :src=\"item\" width=\"100px\" height=\"100px\" />\n        </li>\n      </div>\n    </div>\n    <!-- 小图标区域 -->\n    <div class=\"icon\">\n      <i id=\"icon-1\" class=\"el-icon-thumb\" style=\"font-size: 20px\"></i>\n      <i\n        id=\"icon-1\"\n        class=\"el-icon-chat-dot-square\"\n        style=\"font-size: 20px\"\n        @click=\"Popup\"\n        >{{ comments.commentCount }}</i\n      >\n    </div>\n\n    <!-- 评论 -->\n    <CommentList class=\"newmoment\"  :newcomments=this.allcomment  :Author=comments.author></CommentList>\n   \n   <!-- 发表评论 -->\n   <!-- show是否要显示评论 -->\n   <van-popup v-model=\"show\" position=\"bottom\" :style=\"{ height: '10%' }\">\n      <div class=\"createcomment\">\n        <van-field\n          ref=\"gain\"\n          class=\"input\"\n          v-model=\"comment.content\"\n          rows=\"1\"\n          autosize\n          placeholder=\"请输入评论\"\n          show-word-limit\n          type=\"textarea\"\n          size=\"large\"\n          \n          v-focus\n          maxlength=\"40\"\n        />\n        <van-button class=\"button\" round type=\"info\" @click=\"createcomment\">评论</van-button>\n      </div>\n    </van-popup>\n    \n    \n  </div>\n</template>\n\n<script>\n\nimport CommentList from '@/components/content/comments/CommentList'\nimport {getAllCommnet} from '@/network/comment'\nexport default {\n  name:\"ChildDetailMoment\",\n  components:{\n    CommentList\n  }\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    };\n  },\n  created() {\n    const momentId = this.$route.params.iid;\n    getAllCommnet(momentId).then((res)=>{\n      this.allcomment=res.data;\n    })\n  },\n  //局部组成聚焦\n  directives: {\n  focus: {\n    // 指令的定义\n    inserted: function (el) {\n      el.focus()\n    }\n  }\n},\n  methods: {\n    //是否显示评论和聚焦效果拉键盘\n    Popup() {\n      this.show = !this.show;\n      //延迟聚焦\n      this.$nextTick(() => {\n        this.$refs.gain.focus();\n      }, 100);\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(\"comment/\"+this.commentId+'/reply', this.comment);\n      if(res.insertId!=0){\n        this.iscomment=true\n        this.$emit('refresh')\n        this.$message.success(\"评论成功\");\n      }\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};\n</script>\n\n<style scoped>\n.moment-items {\n  position: fixed;\n  background-color: rgb(255, 255, 255);\n  width: 100%;\n  height: 100vh;\n  font-size: 5px;\n}\n.avatar {\n  float: left;\n  width: 60px;\n  height: 60px;\n  border-radius: 30px;\n}\n.name {\n  float: left;\n  width: 40%;\n  margin-left: 30px;\n  margin-top: 5px;\n  color: rgb(0, 0, 0);\n  font-size: 25px;\n}\n.time {\n  float: left;\n  margin-top: 15px;\n  margin-left: 20px;\n  font-size: 14px;\n  width: 60%;\n}\n.content {\n  width: 100%;\n  float: left;\n  margin-left: 5px;\n  font-size: 18px;\n}\n.icon {\n  width: 100%;\n  float: left;\n  margin-top: 15px;\n  display: flex;\n  border-top-style: solid;\n  border-width: 0.1px;\n  border-color: rgb(230, 220, 220);\n}\n#icon-1 {\n  margin-left: 27%;\n}\n\n.picture {\n  margin-top: 25px;\n  display: inline;\n}\n\n.text {\n  margin-top: 15px;\n}\n.image {\n  margin-top: 10px;\n}\n.input {\n  top: 50%;\n  transform: translate(0, -50%);\n  border-radius: 20px;\n  width: 70%;\n  background-color: rgb(212, 212, 212);\n  float: left;\n  font-size: 15px;\n}\n.button {\n  top: 50%;\n  transform: translate(0, -50%);\n  width: 25%;\n  float: left;\n}\n.createcomment {\n  display: inline;\n  width: 100%;\n}\n.footer{\n  height: 50%;\n}\n.newmoment{\n  margin-right:10px;\n  margin-top:20px;\n  margin-left:10px;\n  float: left;\n  width: 90%;\n}\n</style>"]}]}