{"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/CreateMoment.vue?vue&type=style&index=0&id=365ed8e6&scoped=true&lang=css&","dependencies":[{"path":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/src/views/moment/childComps/CreateMoment.vue","mtime":1618195778311},{"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:CgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgouYmFjayBpbWcgewogIG1hcmdpbi10b3A6IDEycHg7Cn0KLm5hdi1iYXIgewogIGJhY2tncm91bmQtY29sb3I6ICNkZjM4MzI7CiAgZm9udC13ZWlnaHQ6IDUwMHB4OwogIGNvbG9yOiAjZmZmOwp9Cg=="},{"version":3,"sources":["CreateMoment.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"CreateMoment.vue","sourceRoot":"src/views/moment/childComps","sourcesContent":["<template>\n  <div>\n    <NavBar class=\"nav-bar\">\n      <div slot=\"left\" class=\"back\" @click=\"backClick\">\n        <img src=\"~assets/img/common/back.svg\" alt=\"\" />\n      </div>\n      <div slot=\"center\" class=\"title\">发表动态</div>\n    </NavBar>\n    <!-- 动态内容 -->\n    <el-form\n      ref=\"createmoment\"\n      label-width=\"0px\"\n      :model=\"moment\"\n      :rules=\"momentRules\"\n      preview-image:true\n    >\n      <el-form-item prop=\"content\">\n        <el-input\n          type=\"textarea\"\n          :rows=\"2\"\n          placeholder=\"输入你此刻的想法\"\n          v-model=\"moment.content\"\n        >\n        </el-input>\n      </el-form-item>\n      <!-- 图片上传部分 -->\n      <van-uploader\n        :after-read=\"afterRead\"\n        preview-size=\"60px\"\n        v-model=\"fileList\"\n        :max-count=\"3\"\n        :deletable=\"false\"\n        :multiple=\"true\"\n        accept=\"image/png,image/jpeg,image/jpg,image/svg,image/gif\"\n      >\n      </van-uploader>\n\n      <el-form-item class=\"btns\" >\n        <el-row >\n          <el-button type=\"primary\" @click=\"createmoment\" :disabled=\"this.isbtn\" >发表</el-button>\n        </el-row>\n      </el-form-item>\n    </el-form>\n  </div>\n</template>\n\n<script>\nimport NavBar from \"@/components/common/navbar/NavBar\";\nimport { createMoment1, createMoment2 } from \"@/network/createMoment.js\";\nexport default {\n  name: \"CreateMoment\",\n  components: {\n    NavBar\n  },\n  data() {\n    return {\n      moment: {\n        content: \"\",\n        formdata: \"\"\n      },\n      momentRules: {\n        //验证用户名是否合法\n        content: [\n          { required: true, message: \"请输入内容\", trigger: \"blur\" },\n          {\n            min: 5,\n            max: 100,\n            message: \"长度在 5 到 100 个字符\",\n            trigger: \"blur\"\n          }\n        ]\n      },\n      fileList: [],\n      isbtn:false\n    };\n  },\n  created() {\n    this.formdata = new FormData();\n    this.isbtn=false;\n  },\n  mounted(){\n  },\n  methods: {\n    backClick() {\n      this.$router.push(\"/moment\");\n    },\n    createmoment() {\n      this.$refs.createmoment.validate(async valid => {\n        //判断是否符号输入条件\n        if (!valid) return;\n        //向服务器发送内容并且获取本次内容对应id好\n        this.isbtn=true;\n        const { data: res } = await createMoment1(this.moment);\n        //当插入成功，上传图片文件\n        if (res.insertId != 0)\n          this.url = \"/upload/\" + res.insertId + \"/picture\";\n        //上传文件\n        try {\n          await createMoment2(this.url, this.formdata);\n          //向动态发送一个事件监听，让动态页面自动刷新新数据\n          this.$bus.$emit(\"createmoment\");\n          this.$message.success(\"发表成功\");\n          //跳转～\n          this.$router.push(\"/moment\");\n        } catch (err) {this.$message.success(\"发表失败\");}\n      });\n    },\n    // 创建formdata实例对象，把文件存储在formdata中\n    async afterRead(file) {\n      // console.log(file);\n      //    this.formdata.append(\"picture\",file.file);\n      // this.avatarexit = false;\n    if (file instanceof Array && file.length) { // 判断是否是多图上传 多图则循环添加进去\n     file.forEach(item => {\n       this.formdata.append(\"picture\", item.file)//第一个参数字符串可以填任意命名，第二个根据对象属性来找到file\n     })\n     } else {\n     this.formdata.append(\"picture\", file.file)\n      }\n    }\n    //删除图片等技术娴熟再做\n    // async remove(file){\n\n    //   this.fileList.forEach((item)=>{\n    //     console(file.file.lastModifiedDate)\n    //     console.log(item.file.lastModifiedDate);\n    //     if(file.file.lastModifiedDate==item.file.lastModifiedDate){\n    //       console.log(1);\n    //     }\n    //   })\n    //   resolve()\n    // }\n  }\n};\n</script>\n\n<style scoped>\n.back img {\n  margin-top: 12px;\n}\n.nav-bar {\n  background-color: #df3832;\n  font-weight: 500px;\n  color: #fff;\n}\n</style>\n"]}]}