首页+普法活动

src/project/qujing/AppVillageActivity/AddDynamic.vue

@@ -0,0 +1,127 @@
+<template>
+  <div class="dynamic">
+    <div class="form-item">
+      <div class="form-item__wrapper">
+        <div class="form-item__title">
+          <i></i>
+          <h2>内容</h2>
+        </div>
+        <div class="form-item__textarea">
+          <textarea v-model="content" :maxlength="500" placeholder="请输入详细描述信息"></textarea>
+        </div>
+      </div>
+    </div>
+    <div class="form-item">
+      <div class="form-item__wrapper">
+        <div class="form-item__title">
+          <i style="opacity: 0;"></i>
+          <h2>图片上传</h2>
+          <span>(最多9张)</span>
+        </div>
+        <div class="form-item__img">
+          <AiUploader v-model="images" :limit="9"></AiUploader>
+        </div>
+      </div>
+    </div>
+    <div class="btn-wrapper">
+      <div class="btn disabled" hover-class="text-hover" @click="submit">提交</div>
+    </div>
+  </div>
+</template>
+
+<script>
+
+export default {
+  appName: "添加活动动态",
+  data() {
+    return {
+      content: '',
+      images: [],
+      id: '',
+      flag: false
+    }
+  },
+  onLoad(e) {
+    this.id = e.activityId
+  },
+
+  methods: {
+    submit() {
+      if (this.flag) return
+
+      if (!this.content && !this.images.length) {
+        return this.$u.toast('内容或图片不能为空')
+      }
+      this.flag = true
+
+
+      this.$loading()
+      this.$instance.post('/app/appvillageactivitypost/addOrUpdate', {
+        content: this.content,
+        activityId: this.id,
+        avatar: this.$store.state.user.avatarUrl,
+        name: this.$store.state.user.nickName,
+        images: JSON.stringify(this.images)
+      }).then(res => {
+        if (res.code === 0) {
+          this.$toast('提交成功')
+          uni.$emit('update')
+          setTimeout(() => {
+            uni.navigateBack({
+              delta: 1
+            })
+          }, 800)
+        }
+
+        this.$hideLoading()
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.dynamic {
+  .form-item {
+    margin-bottom: 24px;
+    padding-left: 32px;
+    padding-bottom: 20px;
+    background: #fff;
+
+    .form-item__wrapper {
+      padding-right: 32px;
+    }
+
+    .form-item__textarea, .form-item__img {
+      padding-left: 18px;
+
+      textarea {
+        width: 100%;
+      }
+    }
+
+    .form-item__title {
+      display: flex;
+      align-items: center;
+      padding: 32px 0;
+
+      i {
+        font-size: 32px;
+        color: #FF4466;
+      }
+
+      span {
+        font-size: 28px;
+        color: #999999;
+      }
+
+      h2 {
+        padding: 0 4px;
+        font-weight: 600;
+        font-size: 32px;
+        color: #333333;
+      }
+    }
+  }
+}
+</style>