{"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/CommentItem.vue?vue&type=style&index=0&id=10dfde30&scoped=true&lang=css&","dependencies":[{"path":"/Users/linhuakun/Downloads/nodejs/codewhy/src/views/moment/childComps/CommentItem.vue","mtime":1609403284667},{"path":"/Users/linhuakun/Downloads/nodejs/codewhy/node_modules/css-loader/dist/cjs.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/nodejs/codewhy/node_modules/vue-loader/lib/loaders/stylePostLoader.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/nodejs/codewhy/node_modules/postcss-loader/src/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:CgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCi5tb21lbnQtaXRlbXMgewogIHBvc2l0aW9uOiBmaXhlZDsKICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2IoMjU1LCAyNTUsIDI1NSk7CiAgd2lkdGg6IDEwMCU7CiAgaGVpZ2h0OiAxMDB2aDsKICBmb250LXNpemU6IDVweDsKfQouYXZhdGFyIHsKICBmbG9hdDogbGVmdDsKICB3aWR0aDogNjBweDsKICBoZWlnaHQ6IDYwcHg7CiAgYm9yZGVyLXJhZGl1czogMzBweDsKfQoubmFtZSB7CiAgZmxvYXQ6IGxlZnQ7CiAgd2lkdGg6IDQwJTsKICBtYXJnaW4tbGVmdDogMzBweDsKICBtYXJnaW4tdG9wOiA1cHg7CiAgY29sb3I6IHJnYigwLCAwLCAwKTsKICBmb250LXNpemU6IDI1cHg7Cn0KLnRpbWUgewogIGZsb2F0OiBsZWZ0OwogIG1hcmdpbi10b3A6IDE1cHg7CiAgbWFyZ2luLWxlZnQ6IDIwcHg7CiAgZm9udC1zaXplOiAxNHB4OwogIHdpZHRoOiA2MCU7Cn0KLmNvbnRlbnQgewogIHdpZHRoOiAxMDAlOwogIGZsb2F0OiBsZWZ0OwogIG1hcmdpbi1sZWZ0OiA1cHg7CiAgZm9udC1zaXplOiAxOHB4Owp9Ci5pY29uIHsKICB3aWR0aDogMTAwJTsKICBmbG9hdDogbGVmdDsKICBtYXJnaW4tdG9wOiAxNXB4OwogIGRpc3BsYXk6IGZsZXg7CiAgYm9yZGVyLXRvcC1zdHlsZTogc29saWQ7CiAgYm9yZGVyLXdpZHRoOiAwLjFweDsKICBib3JkZXItY29sb3I6IHJnYigyMzAsIDIyMCwgMjIwKTsKfQojaWNvbi0xIHsKICBtYXJnaW4tbGVmdDogMjclOwp9CgoucGljdHVyZSB7CiAgbWFyZ2luLXRvcDogMjVweDsKICBkaXNwbGF5OiBpbmxpbmU7Cn0KCi50ZXh0IHsKICBtYXJnaW4tdG9wOiAxNXB4Owp9Ci5pbWFnZSB7CiAgbWFyZ2luLXRvcDogMTBweDsKfQouaW5wdXQgewogIHRvcDogNTAlOwogIHRyYW5zZm9ybTogdHJhbnNsYXRlKDAsIC01MCUpOwogIGJvcmRlci1yYWRpdXM6IDIwcHg7CiAgd2lkdGg6IDcwJTsKICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2IoMjEyLCAyMTIsIDIxMik7CiAgZmxvYXQ6IGxlZnQ7CiAgZm9udC1zaXplOiAxNXB4Owp9Ci5idXR0b24gewogIHRvcDogNTAlOwogIHRyYW5zZm9ybTogdHJhbnNsYXRlKDAsIC01MCUpOwogIHdpZHRoOiAyNSU7CiAgZmxvYXQ6IGxlZnQ7Cn0KLmNyZWF0ZWNvbW1lbnQgewogIGRpc3BsYXk6IGlubGluZTsKICB3aWR0aDogMTAwJTsKfQouZm9vdGVyewogIGhlaWdodDogNTAlOwp9Ci5uZXdtb21lbnR7CiAgbWFyZ2luLXJpZ2h0OjEwcHg7CiAgbWFyZ2luLXRvcDoyMHB4OwogIG1hcmdpbi1sZWZ0OjEwcHg7CiAgZmxvYXQ6IGxlZnQ7CiAgd2lkdGg6IDkwJTsKfQo="},{"version":3,"sources":["CommentItem.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqIA;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;;AAEA;AACA;AACA;AACA;;AAEA;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":"CommentItem.vue","sourceRoot":"src/views/moment/childComps","sourcesContent":["<template>\n  <div class=\"moment-items\"  >\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    <div class=\"time\">\n      {{ this.$moment(comments.createAT).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    <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    <CommentList class=\"newmoment\" :newcomments=comments.comments :Author=comments.author ></CommentList>\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          autofocus=\"true\"\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'\nexport default {\n  name:\"\"\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      autoinput: false,\n      docmHegiht: \"0\",\n      showHeight: \"0\",\n      hidshow: true,\n      isResize: false,\n      isshow:true,\n      comment: {\n        content: \"\",\n      }\n    };\n  },\n  created() {\n  },\n  methods: {\n    Popup() {\n      this.show = !this.show;\n      // this.autoinput=true\n      //延迟聚焦\n      this.$nextTick(() => {\n        this.$refs.gain.focus();\n      }, 100);\n    },\n    async createcomment(){\n      const { data: res } = await this.$http.post(\"comment/\"+this.comments.id, this.comment);\n      if(res.insertId!=0){\n        this.$emit('refresh')\n        this.$message.success(\"评论成功\");\n      }\n    }\n  },\n  mounted() {\n    window.onresize = () => {\n      return (() => {\n        if (!this.isResize) {\n          this.docmHegiht=document.documentElement.clientHeight;\n          this.isResize = true;\n        }\n        this.showHeight = document.body.clientHeight;\n      })();\n    };\n  },\n  watch:{\n      showHeight:function() {\n       if(this.docmHeight > this.showHeight){\n         this.hidshow=false\n         }else{\n           this.hidshow=true\n         }\n  }\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>"]}]}