feat: ( #322 ) 新增 发布帖子 重构发布菜单 修改`[ commentInput, postMenu, feedIt…

…em...]`等组件

.eslintrc.js

@@ -23,6 +23,7 @@ module.exports = {
     'generator-star-spacing': 0,
     // allow debugger during development
     'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
-    'space-before-function-paren': 0
+    'space-before-function-paren': 0,
+    'no-multiple-empty-lines': [2, { max: 2, maxEOF: 1 }]
   }
 }

src/App.vue

@@ -1,27 +1,28 @@
 <template>
-    <div>
-        <keep-alive>
-            <router-view v-if="$route.meta.keepAlive"></router-view>
-        </keep-alive>
-        <router-view v-if="!$route.meta.keepAlive"></router-view>
-        <svg-icon></svg-icon>
-    </div>
+  <div>
+    <keep-alive>
+      <router-view v-if="$route.meta.keepAlive"></router-view>
+    </keep-alive>
+    <router-view v-if="!$route.meta.keepAlive"></router-view>
+    <svg-icon></svg-icon>
+  </div>
 </template>
 <script>
 export default {
   name: 'app',
   components: {
-    svgIcon: () =>
-            import(/* webpackChunkName: 'svgIcon' */ '@/components/common/svgIcon')
+    svgIcon: () => import(/* webpackChunkName: 'svgIcon' */ '@/components/common/svgIcon')
   }
 }
+
 </script>
 <style lang="less">
 .router-fade-enter-active, .router-fade-leave-active {
-    transition: opacity .3s;
+  transition: opacity .3s;
 }
 
 .router-fade-enter, .router-fade-leave-active {
-    opacity: 0;
+  opacity: 0;
 }
-</style>
+
+</style>

src/components/feed/commentInputTnstance.js

@@ -0,0 +1,106 @@
+import Vue from 'vue'
+import CommentInput from './components/commentInput'
+
+const prefixCls = 'v-comment-input'
+
+CommentInput.newInstance = properties => {
+  const _props = properties || {}
+
+  const Instance = new Vue({
+    data: Object.assign({}, {
+      visible: true,
+      loading: false,
+      placeholder: '随便说说~'
+    }, _props),
+
+    render(h) {
+      let maskVNodes = []
+      maskVNodes.push(h('div', {
+        attrs: {
+          class: `${prefixCls}-mask`
+        },
+        on: {
+          'click': this.maskClick
+        }
+      }))
+
+      let bodyVNodes = []
+
+      bodyVNodes.push(h('div', {
+        attrs: {
+          class: `${prefixCls}-wrap`
+        }
+      }, [h(CommentInput, {
+        class: `${prefixCls}`,
+        props: {
+          loading: this.loading,
+          focus: this.visible,
+          placeholder: this.placeholder
+        },
+        on: {
+          'on-ok': this.ok
+        }
+      })]))
+
+      return h('div', {
+        directives: [{
+          name: 'show',
+          value: this.visible
+        }]
+      }, [maskVNodes, bodyVNodes])
+    },
+    computed: {},
+    methods: {
+      maskClick() {
+        this.visible = !this.visible
+      },
+      cancel() {
+        this.onCancel()
+        this.remove()
+      },
+      ok(txt) {
+        this.loading = true
+        this.onOk(txt, () => {
+          this.loading = false
+          this.cancel()
+        })
+      },
+      remove() {
+        this.$nextTick(() => {
+          this.destroy()
+        })
+      },
+      destroy() {
+        this.$destroy()
+        document.body.removeChild(this.$el)
+        this.onRemove()
+      },
+      onOk() {},
+      onCancel() {},
+      onRemove() {}
+    }
+  })
+
+  const Parent = Instance.$mount()
+  document.body.appendChild(Parent.$el)
+  const Input = Instance.$children[0]
+
+  return {
+    show(props) {
+      if ('onOk' in props) {
+        Parent.onOk = props.onOk
+      }
+      if ('placeholder' in props) {
+        Parent.placeholder = props.placeholder
+      }
+      Parent.onRemove = props.onRemove
+      Parent.visible = true
+    },
+    remove() {
+      Parent.remove()
+    },
+    components: Input
+  }
+}
+
+export default CommentInput