1

src/components/vupload.vue

@@ -0,0 +1,55 @@
+<template>
+  <div id="vupload">
+    <van-uploader :fileList="fileList" :after-read="upload" accept="*" @delete="toDelete" />
+  </div>
+</template>
+
+<script>
+const _ = require('lodash');
+import axios from 'axios';
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'vupload',
+  props: {
+    fileList: { type: Array },
+    url: { type: String, required: true },
+  },
+  model: {
+    prop: 'fileList',
+    event: 'change',
+  },
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {
+    async upload({ file }) {
+      let formdata = new FormData();
+      formdata.append('file', file, file.name);
+      const res = await axios.post(this.url, formdata, { headers: { 'Content-Type': 'multipart/form-data' } });
+      if (res.status === 200 && res.data.errcode == 0) {
+        const { id, name, uri } = res.data;
+        const obj = { name, url: uri };
+        this.fileList.push(obj);
+      }
+    },
+    toDelete(file) {
+      console.log(file);
+      const index = this.fileList.findIndex((f) => _.isEqual(f, file));
+      if (index > -1) this.fileList.splice(index, 1);
+    },
+  },
+  computed: {
+    ...mapState(['user', 'menuParams']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/detailPW.vue

@@ -0,0 +1,125 @@
+<template>
+  <div id="detailPW">
+    <van-row>
+      <van-col span="24" class="main">
+        <van-form @submit="onSubmit" label-width="4em">
+          <van-field readonly clickable name="title" :value="form.title" label="选择展会" placeholder="点击选择" @click="showPicker = true" />
+          <van-popup v-model="showPicker" position="bottom">
+            <van-picker show-toolbar :columns="dockList" value-key="title" @confirm="onConfirm" @cancel="showPicker = false" />
+          </van-popup>
+          <van-field v-model="form.content" rows="2" autosize label="信息内容" type="textarea" placeholder="请输入信息内容" />
+          <van-field name="uploader" label="图片">
+            <template #input>
+              <van-uploader :fileList="img_url" :max-count="1" @delete="file => toDelete(file, 'img_url')" :after-read="file => toUpload(file, 'img_url')" />
+            </template>
+          </van-field>
+          <van-field name="uploader" label="视频">
+            <template #input>
+              <van-uploader :fileList="file_url" :max-count="1" @delete="file => toDelete(file, 'file_url')" :after-read="file => toUpload(file, 'file_url')" />
+            </template>
+          </van-field>
+          <div style="margin: 16px;">
+            <van-button round block type="info" native-type="submit">上传</van-button>
+          </div>
+        </van-form>
+      </van-col>
+    </van-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: dock } = createNamespacedHelpers('dock');
+const { mapActions: dockImgtxt } = createNamespacedHelpers('dockImgtxt');
+const { mapActions: upload } = createNamespacedHelpers('upload');
+export default {
+  name: 'detailPW',
+  props: {},
+  components: {},
+  data: function() {
+    return {
+      // 选择展会
+      dockList: [],
+      showPicker: false,
+      form: {},
+      img_url: [],
+      file_url: [],
+    };
+  },
+  created() {
+    this.search();
+  },
+  methods: {
+    ...dock(['query']),
+    ...dockImgtxt(['create']),
+    ...upload(['upload']),
+    async search() {
+      let res = await this.query();
+      if (this.$checkRes(res)) {
+        this.$set(this, `dockList`, res.data);
+      }
+    },
+    async onSubmit() {
+      let data = this.getFile(this.form);
+      let res = await this.create(data);
+      if (this.$checkRes(res)) {
+        this.$notify({
+          message: '信息上传成功',
+          type: 'success',
+        });
+        this.form = {};
+      } else {
+        this.$notify({
+          message: res.errmsg,
+          type: 'danger',
+        });
+      }
+    },
+    onConfirm(value) {
+      let data = {
+        user_id: value.user_id,
+        dock_id: value._id,
+        title: value.title,
+      };
+      this.$set(this, `form`, data);
+      this.showPicker = false;
+    },
+    async toUpload({ file }, model) {
+      // 上传,赋值
+      const res = await this.upload({ file, dir: 'file' });
+      if (this.$checkRes(res)) {
+        this.$set(this, model, [{ name: res.name, url: res.uri }]);
+      }
+    },
+    toDelete(file, model) {
+      const index = this[model].findIndex(f => _.isEqual(f, file));
+      this[model].splice(index, 1);
+    },
+    // 处理文件
+    getFile(data) {
+      let img_url = this.img_url.find(i => i);
+      if (img_url) data.img_url = img_url.url;
+      else data.img_url = '';
+      let file_url = this.file_url.find(i => i);
+      if (file_url) data.file_url = file_url.url;
+      else data.file_url = '';
+      return data;
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/index.vue

@@ -69,6 +69,10 @@ export default {
           label: '个人中心-账号管理',
           router: '/user/account/index',
         },
+        {
+          label: '图文直播编辑',
+          router: '/detailPW',
+        },
       ],
     };
   },

src/views/live/onAchieve/detail.vue

@@ -80,7 +80,7 @@ export default {
     return {
       client: {},
       dockInfo: {},
-      active: 3,
+      active: 0,
       // 参展项目详情
       projectShow: false,
       form: {},

src/views/live/onAchieve/parts/imgtext_1.vue

@@ -10,7 +10,7 @@
           <van-col span="24" class="brief">
             {{ item.content }}
           </van-col>
-          <van-col span="24" class="image">
+          <van-col span="24" class="image" v-if="item.img_url">
             <el-image :src="item.img_url" class="imagelist"></el-image>
           </van-col>
           <van-col span="24" class="video" v-if="item.file_url">